angularangular-ng-ifng-show

Angular 9 ng-if and ng-show - element is always displayed

In Angular 9 I have code in that I want to hide html element. In typescript I have public property:

export class UserPageComponent implements OnInit {
  public postModel: any = {};

And in Html component I want to check if I should display html element:

<mat-video ng-if="postModel.moviePath != ''" src="{{ postModel.moviePath }}"></mat-video>

But element mat-video is always displayed. When I wanted to use ng-show the result is the same.

Solution

  • You are using angularjs syntax, with angular it should be ngIf directive

    <mat-video *ngIf="postModel.moviePath != ''" src="{{ postModel.moviePath }}"></mat-video>

    Also there is NO ng-show with angular.