ng-transclude中的ng-model

jan*_*mon 2 javascript data-binding angularjs

我在使用ng-model内部时遇到问题ng-transclude.

ng-transclude创建子范围时,不能再将值设置为外部范围.

没有ng-transclude一切正常:

{{text}}
<div>
  <textarea ng-model="text"></textarea>
</div>
Run Code Online (Sandbox Code Playgroud)

使用ng-transclude时,文本将不会更新,因为textarea仅修改子范围:

{{text}}
<pane>
   <textarea ng-model="text"></textarea>
</pane>
Run Code Online (Sandbox Code Playgroud)

http://plnkr.co/edit/GKf7WhnnItVNeBpvSB0F?p=preview

还有其他方式使用ng-model="$parent.text"吗?

小智 10

因为$ parent可能引用不同的范围,具体取决于上下文,建议您声明一个对象来保存您要写入的属性(例如$scope.data = {text: "foo"};),以便在ng-model尝试写入值时(通过ng-model="data.text"),它必须首先进行"读取",沿着原型链查看,直到它最终到达所需范围内的"数据"属性(假设没有其他范围在该过程中具有该属性).

这种方法遵循" 始终使用ng-model中的点 "规则.

(旁注:另一种可能的方法是使用控制器的别名,假设它在您使用的角度版本中可用).

<div ng-controller="ExampleController">
    {{my.text}}
    <pane>
      <textarea ng-model="my.text"></textarea>
    </pane>
  </div>
Run Code Online (Sandbox Code Playgroud)

http://plnkr.co/edit/aESrHtuSH9cd9ljyQAfH?p=preview