Угловой 2: Если значение существует показать html

На данный момент у меня есть служба, которая извлекает значения из ряда API, которые я написал. В шаблоне я хочу вывести только следующий html, если значение существует или не пусто в результатах, когда они подаются в шаблон: 

<li class="title rh-blue-lite-fg">{{ project.meta_header_one }}</li>

Поэтому я пытаюсь выяснить, как обернуть это в ngIf или есть какой-то другой способ сделать это так, чтобы этот элемент 'li' получал выходные данные только в том случае, если это значение присутствует и не пусто

2 2
angular2-template angular2-directives angular2-services

2 ответа:

Я думаю, что вы можете использовать директиву ngIF, чтобы проверить, не является ли project null: 

<li class="title rh-blue-lite-fg" *ngIf="project.meta_header_one">{{ project.meta_header_one }}</li>

Ссылка: https://angular.io/docs/ts/latest/api/common/index/NgIf-directive.html

5

Угловой 4+

Используя Angular 4 или более поздние версии (по крайней мере до Angular 6), вы можете использовать *ngIf с ключевым словом as для хранения значения условия в переменной типа: 

<div *ngIf="condition as value">{{value}}</div>

Таким образом, вам не нужно повторять условие, что может быть полезно, если выражение длинное или содержит вызовы методов, которые вы хотите избежать вызова более одного раза.

Применительно к фрагменту кода из вопроса: 

<li class="title rh-blue-lite-fg" *ngIf="project.meta_header_one as value">{{value}}</li>

Ссылка: * ngIf API Документация

0