NG-transclude内NG-模型 [英] ng-model inside ng-transclude

问题描述

我用时 NG-模型在有一个问题NG-transclude 。

由于 NG-transclude 创建子作用域值不能再设置为外部范围。

As ng-transclude creates child scopes the value can't be set to the outer scope anymore.

没有NG-transclude一切正常：

Without ng-transclude everything works fine:

{{text}}
<div>
  <textarea ng-model="text"></textarea>
</div>

通过NG-transclude文本将不会更新为textarea的只修改子范围：

With ng-transclude the text won't update as the textarea modifies only the child scope:

{{text}}
<pane>
   <textarea ng-model="text"></textarea>
</pane>

http://plnkr.co/edit/GKf7WhnnItVNeBpvSB0F?p=$p$ PVIEW

有没有使用那么任何其他方式 NG-模式=$ parent.text？

Is there any other way then using ng-model="$parent.text"?

推荐答案

为$家长可以指不同的范围，要看具体情况，建议你宣布一个对象来保存你打算写进去的属性（例如： $ scope.data = {文字：富}; ），这样，当NG-模型试图写入值（通过 NG-模式=data.text），它将不得不做出一个读首先，沿着原型链寻找，直到最后达到所要求的范围数据属性（假设存在具有沿途该属性）没有其它的范围。

as the $parent may refer to a different scope, depending on the context, it is advisable that you declare an object to hold properties you intend to write into (e.g. $scope.data = {text: "foo"}; ) , so that when the ng-model is trying to write the value (via ng-model="data.text"), it will have to make a "read" first, looking along the prototype chain, until it finally reaches the "data" property on the desired scope (assuming there is no other scope that has that property along the way).

该方法符合的始终使用点在NG-模型的规则。

This approach follows the "always use the dot in ng-model" rule.

。（边注：另一种可能的方法是使用别名控制器，假设它在你使用的角度版本）

(side note: another possible approach is to use an alias for the controller, assuming it is available in the angular version you are using).

<div ng-controller="ExampleController">
    {{my.text}}
    <pane>
      <textarea ng-model="my.text"></textarea>
    </pane>
  </div>

http://plnkr.co/edit/aESrHtuSH9cd9ljyQAfH?p=$p$ PVIEW

这篇关于NG-transclude内NG-模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！