angularjs - angularjs - ng-switch 不绑定 ng-model

Question

我有这个 repro http://embed.plnkr.co/nVCmukG5abpi1Y4ZHkrq当我点击“Title3”并在文本框中输入一个值时显示，虽然输入的值显示在 UI 中，但当我点击“点击”按钮时什么都没有为范围属性 $scope.test 绑定。

我不知道 ng-switch 有什么问题，或者我做错了什么。帮助表示赞赏！

score 89 · Accepted Answer

由于ng-switch创建了自己的范围，这是一个范围继承问题。

经常提出的一个建议是始终使用 a doton 模型。原因是当控制器范围项是对象而不是原始对象时，子范围将创建对初始对象的引用。如果模型是原始模型，它将不会更新原始模型。

例如：

<input ng-model="test.value" placeholder="pre" type="text" />

$scope.test={value:''}

另一种方法是$parent在 html 模型标记中使用：

<input ng-model="$parent.test" placeholder="pre" type="text" />

使用该dot方法是避免这些问题的好习惯，因为您不需要考虑更深层次的嵌套范围。

score 10 · Accepted Answer

这是因为您实际上是在 ng-switch 内部创建了一个子作用域。所以另一个test属性存在于属于 ngSwitch 指令的范围内。它最初会显示来自它的父范围的值，但是当你编辑它时，因为它是一个原语，它只编辑子级的值，而不是父级的值。原型继承在这里没有发挥作用（但这正是我们所需要的）。

当您单击该按钮时，该按钮正在警报/控制台。记录父范围上的属性...子无法更改。

要$parent.test在 ngSwitch 中修复对 ng-model 属性的这种使用：

一个片段：

<span class="pew"  ng-switch-when="title2">
  <input ng-model="$parent.test" placeholder="pre" type="text" />
  {{test}}
</span>

score 4 · Accepted Answer

我遇到过类似的问题，我通过在控制器中创建一个范围变量并将其与 inng-include和ng-switch. 这样，如果你ng-include用 in 深度嵌套了 'sng-switch并继续下去，我们仍然可以直接使用该范围变量。

由于所有子作用域（此处为ng-include/ ng-switch）都从父作用域（通常是控制器作用域）扩展而来，因此我们可以直接从这些子作用域中的 with 访问父作用域而不会出现问题。

使用$parent将需要像这样写$parent.$parent.$parent.someProp

3 回答 3