Question

我在一个表单标记中有两个select form，其中第二个选项值指的是第一个。

目前，我是以模板驱动的形式设计的，我在第一个(change)中实现了select form属性。

基本上，第一个select form选择id作为其选项值，然后它将作为参数传递，以便第二个select form可以根据id获取其选项值。

该函数没有抛出任何错误，但它没有将值加载到下拉列表中。

解决方法是什么？

编辑：这是json模型：

 {
        "id": 1,
        "title": "bookA",
        "authors": [
            "authorA",
            "authorB"
        ]
},
 {
        "id": 2,
        "title": "bookB",
        "authors": [
            "authorA",
            "authorB",
            "authorC"
        ]
},

我希望第一个select form加载标题，然后第二个select form加载相应的作者。

Answer 1

没有代码，这将很难帮助。

但如果你想要一个简单的解决方案，那么它就是：

options = [
  { option: 'Option 1', value: 'opt1', subOptions: [
    { option: 'Option 1-1', value: 'opt1-1' }
  ]},
  { option: 'Option 2', value: 'opt2', subOptions: [
    { option: 'Option 2-1', value: 'opt2-1' }
  ]},
];

在您的HTML中：

<select [(ngModel)]="select1">
  <option *ngFor="let option of options" [value]="option">{{option.option}}</option>
</select>
<select [(ngModel)]="select2" *ngIf="select1">
  <option *ngFor="let option of select1.subOptions" [value]="option">{{option.option}}</option>
</select>

Angular 4 - 选择第一个选择表单后刷新第二个选择表单的列表

1 个答案: