Local Template Variable

  • The hashtag (#) defines a local variable inside our template
  • We can refer to a local template variable anywhere in the current template
  • To consume, simply use it as a variable without the hashtag
  • The canonical form of #variable is ref-variable
<span *ngIf="currentPortfolio.id; else prompt">Editing {{originalName}}</span>
<ng-template #prompt>Create</ng-template>
<form #formRef="ngForm">
    <label>Item Name</label>
    <input [(ngModel)]="selectedItem.name" 
        type="text" name="name" 
        required placeholder="Enter a name">
    <label>Item Description</label>
    <input [(ngModel)]="selectedItem.description" 
        type="text" name="description" 
        placeholder="Enter a description">
    <button type="submit" 
        [disabled]="!formRef.valid" 
        (click)="saved.emit(selectedItem)">Save</button>
</form>