16

ここで単純な（そして重要な）何かが欠けていると思います。いくつかの値にマップされた入力を含む付属のテンプレートを使用しています:

<div ng-controller="Ctrl">
    <div ng-include src="'template.html'"></div>
</div>

<!-- template -->
<script type="text/ng-template" id="template.html">
    <input ng-model="testvalue" />
</script>

コントローラ：

function Ctrl($scope) {    
   $scope.testvalue= "initial value";
}​

$scope.testvalue の値を警告すると、更新された値ではなく、常に初期値が表示されます (入力を入力したとき)。助けてオビワン。あなたは私たちの唯一の希望です。

フィドル: http://jsfiddle.net/h5aac/

4

2 に答える 2

31

これは、オブジェクトではなくプリミティブにバインドする場合によくあることです。オブジェクトへの参照ではなく、文字列の値が渡されます。プリミティブの代わりにオブジェクトを使用すると、問題なく動作します。あなたの範囲でこのようなもの。

$scope.foo = {testvalue: "initial value"};

http://jsfiddle.net/h5aac/2/を参照してください

また：

AngularJS のトランスクルードされたディレクティブ内で「ng-model」を使用する

ngRepeat のディレクティブの場合のバインドの問題

AngularJS - 非同期応答でスコープ値を更新する

きっと、もっとあると思います...

于 2012-12-12T20:59:14.990 に答える
7

親スコープのオブジェクトプロパティを参照する代わりに、$parentを使用して親スコープのプリミティブにアクセスすることもできます。

<input ng-model="$parent.testvalue" />

ng-includeは子スコープを作成します。そのスコープは、通常、Ctrlの親スコープから継承します。3つのバリエーションの仕組みは次のとおりです。

  • $ parent.testvalueは、モデルを親スコープのプロパティに関連付けます
  • testvalue自体は、モデルを子スコープで作成される新しいプロパティに関連付けます。このプロパティは、同じ名前で親スコーププロパティを「シャドウ/非表示」にします。
  • foo.testvalue（たとえば、@ dnc253の回答を参照）も、モデルを親プロパティに関連付けます。これは次のように機能します。Javascriptは子スコープで「foo」を認識/検索しないため、親スコープで検索し（プロトタイプの継承のため）、そこで検索します。

子スコープがどのように見えるかを確認するには、元のフィドルを使用して、このコードをテンプレートのどこかに追加します。

<a ng-click="showScope($event)">show scope</a>

そして、このコードをCtrlに追加します。

$scope.showScope = function(e) {
   console.log(angular.element(e.srcElement).scope());
}

テキストボックスに入力する前に、[スコープを表示]リンクをクリックします。コンソール（私はChromeを使用しています）で、「子」スコープを展開して、まだtestvalueプロパティが含まれていないことを確認できます（「初期値」がどのように表示されているかわからないため、驚くべきことです。テキストボックス内）。$ parentを展開すると、そこにtestvalueプロパティが表示されます。この名前のプロパティは、現時点では親スコープにのみ存在するように見えます。

次に、コンソールをクリアし、テキストボックスに入力して、[スコープの表示]リンクをもう一度クリックします。「子」スコープに新しいtestvalueプロパティが追加されたことがわかります。親プロパティをシャドウ/非表示にします。したがって、子スコープ内のものは子スコープtestvalueプロパティを参照し、親スコープ内のものは親スコープtestvalueプロパティを参照します。

更新：参考までに、私は最近、スコープのプロトタイプの継承に関する広範な回答/記事を書きました。これは、上記の概念をより詳細に説明し、多くの写真を掲載しています。AngularJSのスコープのプロトタイプ/プロトタイプの継承のニュアンスは何ですか？

于 2012-12-12T23:48:49.690 に答える