How to work with Angular ngIF with screen resolution?

Navigation
0

See below how the Web page is;

Nowwatchthescreenwithresolutionbelow992px

Thishappensbecauseofthecsscolumn

I'dliketotakethiscolumnoutwhenitreacheslessthan992pxwithangledngIF,isitpossible?Ifso,howcanIdoit?

Isthiscodehere?

<divclass="container">
    <div class="ui-g">
        <div class="ui-g-12  ui-lg-3"></div>
        <div class="ui-g-12  ui-lg-3 conheca_projeto"><h1><p>CONHEÇA</p>  O PRJETO</h1></div>
        <div class="ui-g-2  ui-lg-2">
            <div class="seta_topo animated  fadeInDown">
                <img src="assets/img/seta.JPG" height="250" >
            </div>
        </div>
        <div class="ui-g-12  ui-lg-4  seja_doador">
                <h1>SEJA UM DOADOR</h1>
            </div>
        <div class="ui-g-12  ui-lg-3"></div>
    </div>
</div>
    
asked by anonymous 08.06.2018 / 17:02

2 answers

1

Taking width onInit 

public innerWidth: any;
ngOnInit() {
    this.innerWidth = window.innerWidth;
}

To keep updated on resize. 

@HostListener('window:resize', ['$event'])
onResize(event) {
  this.innerWidth = window.innerWidth;
}

Html 

<div *ngIf="innerWidth > algumNumero">
    
11.06.2018 / 09:45
0

You could remove the component using average queries.

If it works for you, you can do it this way: 

 @media screen and (max-width: 992px) {
   .conheca_projeto{  display: none ; } 
 }
    
08.06.2018 / 21:13
Define functions for equal values and values in ascending order - Python Working with datepicker in ng-bootstrap