Question

是否可以在html的“值”字段中传递多个变量？我需要（例如）

value = {{option.formula and option.option}}. //whatever syntax that would be if even possible

这是我到目前为止所拥有的

<select class="form-control" required formControlName="high_availability">
    <option *ngFor="let option of arr" value={{option.formula}} [disabled]="option.disabled"> {{option.option}} </option>
</select>

提前谢谢。

Answer 1

尝试一下，如果您的预期输出为value = {{option.formula and option.option}}

，它应该可以工作

<select class="form-control" required formControlName="high_availability">
    <option *ngFor="let option of arr" 
            value="{{option.formula}} and {{option.option}}"
           [disabled]="option.disabled"> {{option.option}} </option>
</select>

Answer 2

将循环置于选项定义之外。

<select class="form-control" required formControlName="high_availability">
    <ng-contianer *ngFor="let option of arr">
        <option value={{option.formula}} [disabled]="option.disabled"> {{option.option}} </option>
    </ng-container>
</select>

Answer 3

请尝试执行此操作，因为我认为该代码在此处可见更好，然后在上面进行注释。我正在使用Angular Material，但是逻辑是相同的。

查看

<mat-form-field>
 <mat-select (selectionChange)="doSomething($event)"> 
  <mat-option *ngFor="option of arr" [value]="option">
   {{ option.option }}
  </mat-option>
 </mat-select>
</mat-form-field>

组件

doSomething(event) {
  let mySelectedOption: any = event.source.value
  console.log(mySelectedOption)
}

角度4：选项标签的多个值

3 个答案: