0

在这个plnkr中,在 src 内部检测到编辑的值,但是 src 外部的值保持空白。

在 plnkr 中选择不同的单选按钮,外部 src 不会更新。

我可以知道为什么以及如何解决这个问题吗?

4

2 回答 2

1

ng-model这是 an中不包含 a的典型示例.

这是解决问题的相关plunker。

普朗克

app.controller('testCtrl',function($scope,$timeout){
  $scope.data = {
    filteringText : ''
  };

});

发生这种情况是因为 ng-include 创建了一个新范围,并且由于原型在 javascript 中的工作方式,子原型中的原始值会覆盖父原型中的原始值。如果在原型继承方面不清楚,请阅读本文。

PS:使用$parent不是一个好的设计。它将视图与逻辑紧密结合。

于 2013-10-10T16:20:43.857 回答
1

这是因为 ng-include 正在创建自己的范围,而您使用单选按钮分配的 ng-model 值仅限于该范围。

因此,您在主体中的 {{ filteringText }} 不知道过滤文本是使用 ng-model 设置的。

如果我们将您的 ng-include 的内容转移到正文中,如下所示:

  <body ng-controller="testCtrl">


    <div ng-include src="'input.html'"></div>

  <input type="radio" ng-model="filteringText" value="">All
  <input type="radio" ng-model="filteringText" value="Add">Add
  <input type="radio" ng-model="filteringText" value="Edit">Edit
  <input type="radio" ng-model="filteringText" value="Delete">Delete
  </br>
    Outside src : {{filteringText}}

然后我们看到外部 src 更新了,正如我们所期望的那样,使用 ng-model 值。

如果我们想从 ng-include 更新主应用范围内的值,我们可以在 input.html 文件中使用 $parent.value,如下所示:

<input type="radio" ng-model="$parent.filteringText" value="">All
<input type="radio" ng-model="$parent.filteringText" value="Add">Add
<input type="radio" ng-model="$parent.filteringText" value="Edit">Edit
<input type="radio" ng-model="$parent.filteringText" value="Delete">Delete
<br/>
Inside src : {{$parent.filteringText}}

当您在 ng-include 中进行更改时,这将更新您的主体。

于 2013-10-10T16:16:10.263 回答