0

私のindex.htmlは次のようになります：

<div id="div1" ng-controller="StartMenu">
  <div id="button1" ng-click="doSomething()"></div>
  {{value}}
</div>
<div id="div2" ng-view></div>

モジュール構成：

angular.module('app').config([$routeProvider, function($routeProvider) {
  $routeProvider.when('/start', {
    templateUrl: 'partials/start.html', controller: StartMenu
  });
}]);

start.html：

<div id="button2" ng-click="doSomething()"></div>
{{value}}

そしてコントローラー機能：

function StartMenu($scope, globals) {    // service globals defined elsewhere
  $scope.value = globals.value
  $scope.doSomething = function() {
    // Manipulate globals.value
    $scope.value = globals.value;
  }
}

問題：index.htmlのこれら2つのdiv要素は、同じコントローラー関数を共有しています。＃div1の＃button1をクリックすると、doSomethingが呼び出され、$scope.valueが変更されます。変更はすぐに＃div1にレンダリングされ、{{value}}が変更されますが、＃div2は変更されません。＃div2を「強制」してレンダリングし、{{value}}の変更を表示するにはどうすればよいですか？

4

2 に答える 2

2

ng-viewは独自の（子）スコープを作成するため、{{value}}instart.htmlは子スコープに作成されます。このvalueプロパティは、親スコープ内の同じ名前のプロパティを非表示/シャドウします。いくつかの可能な解決策があります：

  1. start.htmlで{{$parent.value}}を使用します
  2. 親$scopeでプリミティブの代わりにオブジェクトを使用します（例：$ scope.obj = {value：2}）。次に、子でそれを参照します：{{obj.value}}。（親スコープの値はすでに他の何かを参照しているため、これは特定のシナリオでは機能しません。）
  3. start.htmlで関数を使用します：{{value（）}}-親スコープでその関数を定義します。

スコープの継承の詳細については、「 AngularJSでのスコープのプロトタイプ/プロトタイプの継承のニュアンスは何ですか？」を参照してください。

更新： HTMLの読み取りが速すぎます...div2がdiv1に含まれていません。問題は2つあります。

  1. 2つのコントローラーが作成されており、それぞれがvalue独自のスコープで独自のプロパティを作成します
  2. がプリミティブの場合globals.value、コントローラスコープは参照ではなく値のコピーを取得しています。

上記のソリューション2と3がここに適用されます。
2 =グローバルにオブジェクトを作成し、コントローラースコープでそのオブジェクトのプロパティを参照します（つまり、プリミティブを使用しないでください）。
3 =コントローラーの関数を使用して、グローバルプリミティブ値にアクセスします。両方のソリューションのフィドルは、以下のコメントにあります。

于 2013-01-14T20:38:48.020 に答える
0

この場合、値をサービスに渡し、サービスから取得できます

    // controller
    yourservicename.yourfunction = 'somthing text';

    $scope.getvalue = function() {

        return yourservicename.yourfunction;
    }

     // view

    <div ng-controller="myCtrl" > {{getvalue()}} </div>
    <div ng-controller="myCtrl" > {{getvalue()}} </div>
于 2015-10-22T07:16:24.313 に答える