Я хочу показать код c html на основе значения 'item'. Для этого я продублировал 10 ng-контейнеров с директивой * ngIf. Первые 9 работают правильно, но последний не хочет отображаться, хотя выражение истинно.
<ng-container *ngIf="item == '1'">
*works*
</ng-container>
//...2,3,4,5,6,7,8,
<ng-container *ngIf="item == '9'">
*works*
</ng-container>
<ng-container *ngIf="item == '10'">
//Do not want to display even if item has '10' value
</ng-container>
Самое смешное, что даже если я наберу *ngIf="true"
в последнем ng-контейнере, он все равно не хочет для отображения данных
component
ngOnInit() {
this.context = this.router.url.replace('/faq/sections/', '').slice(0, -2);
this.item = this.route.snapshot.params['id'];
}
<ng-container *ngIf="context == 'instructions'">
<ng-container *ngIf="item == '1'"></ng-container>
//...2,3,4,5,6,7,8,9
<ng-container *ngIf="item == '10'">
<h2>text</h2>
<div class="row">
<div class="col-md-4 p-3 text-center">
<img src="assets/money-outside.svg" alt="qiwi">
<p class="mt-3">text</p>
</div>
<div class="col-md-4 p-3 text-center">
<img src="assets/phonenmoney.svg" alt="qiwi">
<p class="mt-3">text</p>
</div>
<div class="col-md-4 p-3 text-center">
<img src="assets/inst-q-3.svg" alt="qiwi">
<p class="mt-3">text</p>
</div>
<div class="col-md-4 p-3 text-center">
<img src="assets/book-in-6.svg" alt="qiwi">
<p class="mt-3">text</p>
</div>
</div>
</ng-container>
</ng-container>