无法将ngModel绑定为动态命名

Question

动态创建输入项列表，并在输入无效或不干净时显示错误。

<mat-list *ngFor ="let vehicle of vehicleList; let i = index;">
    <mat-list-item class="row">
        <span class="col-md-1">{{i + 1}}</span>
        <input pattern="{{vehiclePattern}}" type="text" [(ngModel)]="vehicle.vehicle_number"
               name="vehicle{{i}}" #vehicle="ngModel"/>
        <div *ngIf="(vehicle + i).invalid && ((vehicle + i).dirty)" class="alert alert-danger">
            <div *ngIf="(vehicle + i).errors.pattern">
                Enter a valid Vehicle
           </div>
       </div>
    </mat-list-item>
</mat-list>

因此，我需要一些生成以下代码的解决方案：

<input pattern="{{vehiclePattern}}" type="text" [(ngModel)]="vehicle.vehicle_number"
           name="vehicle0" #vehicle0="ngModel"/>
     <div *ngIf="vehicle0.invalid && (vehicle0.dirty)" class="alert alert-danger">
        <div *ngIf="vehicle0.errors.pattern">
            Enter a valid Vehicle
        </div>
   </div>


<input pattern="{{vehiclePattern}}" type="text" [(ngModel)]="vehicle.vehicle_number"
           name="vehicle1" #vehicle1="ngModel"/>
   <div *ngIf="vehicle1.invalid && (vehicle1.dirty)" class="alert alert-danger">
        <div *ngIf="vehicle1.errors.pattern">
            Enter a valid Vehicle
        </div>
   </div>