Question

我使用带有角度材质的动态表格。表中的每一行都有一个选择下拉字段。默认情况下，禁用与下拉字段相邻的按钮。当用户从下拉列表中选择任何选项时，该按钮应自动变为可点击。

但是，我收到指向此代码的错误(ngModelChange)="'isDisabled'+i=$event"：

未捕获错误：无法分配给引用或变量！

<ng-container matColumnDef="job-id">
      <mat-header-cell *matHeaderCellDef></mat-header-cell>
      <mat-cell *matCellDef="let element; let i = index">
        <mat-form-field class="job-id-field">
          <mat-select (change)="onSelectJobId($event)" (ngModelChange)="'isDisabled'+i=$event" placeholder="Select Job ID" [ngModel]="'isDisabled'+i" required>
            <mat-option *ngFor="let job_id of element.job_id" [value]="job_id.job_id_id">
              {{ job_id.job_id_id }}
            </mat-option>
          </mat-select>
        </mat-form-field>
      </mat-cell>
    </ng-container>

     <!-- Manage Tabs Column -->
     <ng-container matColumnDef="manage-tabs">
      <mat-header-cell *matHeaderCellDef></mat-header-cell>
      <mat-cell *matCellDef="let element; let i = index">
          <button *ngIf="!showArchivedBrand" mat-button [disabled]="'isDisabled'+i" [routerLink]="[element.id, 'manage-tabs']">Manage Tabs</button>
        </mat-cell>
    </ng-container>

    <!-- Brand Guidelines Column -->
    <ng-container matColumnDef="brand-guidelines">
      <mat-header-cell *matHeaderCellDef></mat-header-cell>
      <mat-cell *matCellDef="let element">
        <button *ngIf="!showArchivedBrand" mat-button [routerLink]="[element.id, 'guidelines']">Guidelines</button>
      </mat-cell>
    </ng-container>

Answer 1

您正在尝试将对象分配给字符串文字。例如，当我为1时，(ngModelChange)="'isDisabled'+i=$event"将会使用'isDisabled1' = $event语句。

理想情况下，此“已禁用”属性将成为每行的表数据的一部分，您可以简单地绑定到该行。 [disabled]="element.disabled"。

由于您只是在从select中选择任何值时尝试启用按钮，因此您实际上不需要任何模型来执行此操作。只需为选择组件指定模板引用，并使用它来检查值。

<mat-select #jobIDSelect (change)="onSelectJobId($event)" placeholder="Select Job ID" required>

...
<button *ngIf="!showArchivedBrand" mat-button [disabled]="jobIDSelect.value" ... >Manage Tabs</button>

您可能还需要一个用于作业ID选择的模型，我不确定，但也许您正在通过(change)="onSelectJobId($event)"来处理。

如何使用Angular Material将索引值与ngModel连接起来

1 个答案: