我正在尝试使用动态选择框实现 Angular 5 的选择选项，具体取决于哪个后端组件发送选择。
请注意，两个 selectBox 是同一个框，只是选项内的值发生了变化。
selector.html
<html>
...
<select>
<option *ngFor="let selectorA in selectorAs">{{selectorAs}}</option>
</select>
...
selector.ts
import{component} from '@angular/core'
@component({
selector: 'app-root'
templateUrl: './selector.html'
styleUrl: './selector.css'
})
export class AppComponent{
title = 'app';
selectorAs = ["option 1", "option 2", "option 3"];
selectorBs = ["option A", "option B", "option C"];
所以我的问题是如何根据传入的标志使选择选项动态选择 selectorBs 而不是 selectorAs？
最佳答案
您可以定义一个指向当前选项列表的变量:
export class AppComponent{
choicesA = ["option 1", "option 2", "option 3"];
choicesB = ["option A", "option B", "option C"];
currentChoiceList: string[];
processBackendData() {
this.currentChoiceList = condition ? this.choicesA : this.choicesB;
}
}
并在模板中使用它:
<select>
<option *ngFor="let choice of currentChoiceList">{{choice}}</option>
</select>
关于html - 如何动态选择 Angular 5的下拉列表？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51717193/