Question

我有两个以角度方式绑定到模型的select元素。第一个应显示进程列表，第二个应显示属于该进程的变量列表。我的数据模型看起来像这样：

"processes": [
    {
        "name": "proces1",
        "variables": [
            "var1",
            "var2"
        ]
    },
    {
        "name": "proces2",
        "variables": [
            "var3",
            "var4"
        ]
    }
]

我的选择结果需要以“滑块”结尾。 “滑块”中的对象＆＃39;范围上的数组：

$scope.sliders = 
[
  {
    process : "process1",
    tag     : "var1",
  }
]

我已经实现了以下选项，受到this jsfiddle的启发。

<tr ng-repeat="slider in sliders track by $index">
    <td><select name="processSelect"  ng-model="slider.process" ng-options="process.name for process in slider.processes"></select></td>
    <td><select name="variableSelect" ng-model="slider.tag"     ng-options="v for v in slider.process.variables"></select></td>
</tr>

该方法有效，但是如果我的模型已经填充，则只选择variableSelect。过程选择不是。这是因为processSelect使用了一个进程字典列表而不是字符串（存储在模型中）。

我能做些什么来实现这个目标？人们通常如何以角度来实现这一目标？

Answer 1

我通过稍微改变我的数据模型来解决这个问题：

"processes": {
    "process1": [
        "var1",
        "var2"
    ],
    "process2": [
        "var3",
        "var4"
    ]
}

然后我将ng-options更改为：

<tr ng-repeat="slider in sliders track by $index">
 <td><select name="processSelect" ng-model="slider.process" ng-options="key as key for (key, value) in processes"></select></td>
 <td><select name="variableSelect" ng-model="slider.tag" ng-options="value for (key, value) in processes[slider.process]"></select></td>
</tr>

基本上遵循ng-options上的角度文档。

使用angularjs恢复链式选择

1 个答案: