1

Angularjsでのデータバインディングを理解しようとしています。

私がやりたいのは、ページ間のバインディングを確立することです。つまり、first.htmlの入力を変更すると、second.htmlのデータが自動的に変更されます。

たとえば、これはfirst.htmlです。

<div ng-controller="MyCtrl">
  <input type="text" ng-model="value"/><br>

   {{value}}

<a href="#/second"><input type="submit" value="Second page"/></a>
</div>

そして、second.htmlにはこのコード{{value}}しかないと言います。

.jsファイルには$routeProviderがあり、テンプレートのURLを「second.html」とし、コントローラーは「MyCtrl」です。

したがって、コントローラーは次のとおりです。

MyApp.controller(function($scope){

 $scope.value="somevalue";

 })

上記の方法を実行することにより、second.htmlの{{value}}は値「somevalue」を取得します。これはコントローラーから来ています。

しかし、first.htmlにある入力値を動的に変更すると、second.htmlの値はその値を取得しません。

私の質問は、second.htmlの値をfirst.htmlに自動的にバインドする方法です。

質問を明確に理解するために、first.htmlにテキストを入力するための入力フィールドと送信ボタンがあるとします。次に、送信のsecond.htmlページでfirst.htmlのテキストフィールドの入力値を取得します。

4

4 に答える 4

3

サービスを使用して、モデルをそこに保存します。Gloopyにはすでにこの良い例があります:https
://stackoverflow.com/a/12009408/215945プリミティブ型の代わりにオブジェクトプロパティを使用してください。

$ rootScopeを使用する場合は、上記のように、プリミティブではなくオブジェクトを定義します。

$rootScope.obj = { prop1: "somevalue" }`

次に、ビュー内のそのオブジェクトプロパティにバインドします。

<input type="text" ng-model="obj.prop1">
{{obj.prop1}}
于 2013-02-27T23:42:28.607 に答える
1

データを$rootScopeにアタッチすると、コントローラー間の遷移に耐え、すべての$ scopesの一部になります(プロトタイプ継承マジック)

//**attach in controller1:**
function MyCtrl1($rootScope) {
    $rootScope.recs= { rec1 : "think philosophically" };
}

//**do nothing in controller for view2:**
function MyCtrl2($scope) {
  //nothing
}

//**Markup for view2: automaticall makes use of data in $routeScope**
<p>Try doing this: {{recs.rec1 }}</p>

//**markup for view1 to respond to OPs question in comments**:
<input ng-model="recs.rec1" />

更新:カスタムサービスの作成は、これを処理するためのよりスケーラブルで構造的に適切な方法ですが、$rootScopeメソッドは迅速で汚い方法です。

Update2:OPの質問に回答するためのview1マークアップを追加し、プリミティブではなくオブジェクトを使用するための正しいアドバイスを利用するように例を編集しました。

于 2013-02-27T22:37:41.987 に答える
0

私が探していたものの解決策を見つけました。解決策はAngularのドキュメントにあります。ここにリンクhttp://docs.angularjs.org/cookbook/deeplinkingがあります。

そのリンクの例の一部が私の質問に答えています。

于 2013-03-02T02:35:29.103 に答える
0

$ broadcast、$ emit、またはスコープ通信を使用する必要があります。rootScopeの過負荷を回避するようにしてください。アプリケーションセッションにデータを保存するのと同じくらい悪い習慣です。

于 2014-04-21T19:41:23.570 に答える