选择输入更改不会影响模型状态答案

【问题标题】：Select input changes do not effect on model state选择输入更改不会影响模型状态
【发布时间】：2013-10-25 19:28:11
【问题描述】：

- 声明 3 个带有要选择的分层数据的选择输入：

<select data-ng-model="current.manufacturer" data-ng-options="c.name for c in manufactures"></select>
<select data-ng-model="current.mark" data-ng-options="c.name for c in current.manufacturer.marks" data-ng-disabled="!current.manufacturer"></select>
<select data-ng-model="current.material" data-ng-options="c for c in current.mark.materials" data-ng-disabled="!current.mark"></select>

和数据模型：

[{ name: "manufacturer_name", 
        marks: [{ name: "mark_name", 
               materials: ["material", ..] }, ...]}, ...]

当我选择第一个输入值时，它会启用第二个；第二次选择后可以选择第三个选项。但是，如果我更改第一个选项，第二个输入会重置其值，但它不会影响模型值并且第三个元素不会被禁用。问题可见here。

当第二个输入的选择改变时，如何改变current.mark的值？

【问题讨论】：

你永远不会清除 current.material 或 current.mark。当您更改第一个选项时，它实际上并没有清除该值（您仍然可以在底部看到该值），但是由于您正在选择一个对象，因此选择框会清除。例如，如果您选择“derp, 1, a”然后切换到“herp”，标记保持“1”，材料保持“a”。由于中间选择的新选项中不存在“1”，因此它是空白的。但是由于 mark 仍然是 '1'，所以第三个选择具有相同的选项，并且 'a' 仍然是有效的选项。
@JasonGoemaat, jsfiddle.net/WRz9f/1 将标记和材料的数据更改为相同后，第二个值也消失了

标签： javascript html angularjs select

【解决方案1】：

mark 和 material 不会在您更改 manufacturer 时被重置。我继续往范围内添加了一些手表，以便您可以在发生变化时隐式设置模型值。

$scope.$watch('current.manufacturer', function (newValue, oldValue) {
    if (newValue !== oldValue) {
        $scope.current.mark = null;
        $scope.current.material = null;
    }
});

$scope.$watch('current.mark', function (newValue, oldValue) {
    if (newValue !== oldValue) {
        $scope.current.material = null;
    }
});

似乎得到了你想要的。

Fiddle

也许其他人可以用更简单的方式解决它。

【讨论】：

可能不是最简单的，但 100% 有效的答案，谢谢！