How to declare a variable in a template in Angular

<div ngFor="let a of [aVariable]">

  <span>{{a}}</span>

</div>

<div ngFor="let a of [aVariable | async]">

  <span>{{a.prop1}}</span>

  <span>{{a.prop2}}</span>

</div>

   <mat-accordion class="accord-align" #open>

      <mat-expansion-panel hideToggle="true" (opened)="open.value=true" (closed)="open.value=false">

        <mat-expansion-panel-header>

          <span class="accord-title">Review Policy Summary</span>

          <span class="spacer"></span>

          <a ngIf="!open.value" class="f-accent">SHOW</a>

          <a ngIf="open.value" class="f-accent">HIDE</a>

        </mat-expansion-panel-header>

        <mat-divider></mat-divider>

        <!-- Quote Details Component -->

        <quote-details [quote]="quote"></quote-details>

      </mat-expansion-panel>

    </mat-accordion>

import { Directive, Input } from "@angular/core";

@Directive({

    selector:"[localVariables]",

    exportAs:"localVariables"

})

export class LocalVariables {

    @Input("localVariables") set localVariables( struct: any ) {

        if ( typeof struct === "object" ) {

            for( var variableName in struct ) {

                this[variableName] = struct[variableName];

            }

        }

    }

    constructor( ) {

    }

}

<div #local="localVariables" [localVariables]="{a: 1, b: 2, c: 3+2}">

   <span>a = {{local.a}}</span>

   <span>b = {{local.b}}</span>

   <span>c = {{local.c}}</span>

</div>