Динамические шаблоны в Angular5

Двухстороннее связывание данных

Синтаксис: [(ngModel)]="serverName"

<input
type="text"
class="form-control"
[(ngModel)]="serverName">

Для использования [(ngModel)] необходимо, чтобы был подключен FormsModule.

ngIf условие

\app\servers\servers.component.html:

<p *ngIf="serverCreated">
Server name: {{ serverName }}
</p>

\app\servers\servers.component.ts:

serverCreated = false;
onServerCreate() {
this.serverStatus = "Server is ON";
this.serverCreated = true;
}

Синтаксис *ngIf="boolean" означает, что данный html блок элемент появится только если выражение равно true.

Редактировать на GitHub