Смена шаблона в соответствии с условием в угловых 6

Question

У меня есть шаблон для dashobaord с заголовком, fooyter и содержимым. Мне нужен другой шаблон, который должен быть загружен для некоторого условия в angular 6. Это мой текущий шаблон для панели инструментов

<app-header></app-header>
    <div class="wrapper">
     -------
    </div>
<app-footer></app-footer>

и мне нужно загрузить другой компонент <app-no-permission ></app-no-permission> для некоторых условий.

это мой файл dashboard.component.ts

ngOnInit() {
    this.auth.menuAccessCheck(this.router.url).subscribe(datas => {
      this.menuAccess = datas;
      if(this.menuAccess.data.can_view==1){
        //load normal template
      }else{
        //load app-no-permission template
      }
    });

Answer 1

Вы можете использовать NgIf для этого. Давайте предположим, что this.menuAccess.data.can_view может быть 1 или 2. Вот как должен выглядеть .html:

<app-header></app-header>
    <div class="wrapper">
       <span *ngIf="menuAccess.data.can_view == 1"> Showwing ONE</span>
       <span *ngIf="menuAccess.data.can_view == 2"> Showwing TWO</span>
    </div>
<app-footer></app-footer>

Просто замените span на то, что вы хотите, и ваша логика заработает.