2016-04-20 10 views
0

私は2つのコントローラ間で通信するコードを書く方法を探していました。私は動作しているが、アプローチが良いか標準であるかわからない1つのコードを得た。 コードを見直して、2つのコントローラ間の通信方法に従うべきだと教えてください。AngularJS:2つのコントローラ間の通信のための正しい方法

<body ng-app="app"> 
    <div ng-controller="firstCtrl"> 
    controller 1 
<select ng-options="item for item in items" ng-model="mdl"> 
</select> 
    <button ng-click="updateAlphabets()">update</button> 
    </div> 

    <div ng-controller="secondCtrl"> 
    controller 2 
<select ng-options="item for item in items" ng-model="mdl"> 
</select> 
    <button ng-click="updateItems()">update</button> 
    </div> 
</body> 

function firstFunc($scope){ 
    $scope.items=["one","two","three"]; 
    $scope.updateAlphabets=function(){ 
    secondFunc($scope); 
    $scope.updateItems(); 
    }; 
} 

function secondFunc($scope){ 
    $scope.items=["apple","boy","cat"]; 
    $scope.updateItems=function(){ 
    $scope.items=["a","b","c"]; 
    }; 
} 

angular.module("app",[]).controller("firstCtrl",["$scope", 
firstFunc]).controller("secondCtrl",["$scope", 
secondFunc]); 

私は今角を学んでいるので、私は正しいアプローチとパターンの後に大多数の人々が従うので、提案を探しています。ありがとう

+0

おそらく重複http://stackoverflow.com/questions/11252780/whats-the-correct-way-to-communicate-between-controllers-in-angularjs?rq=1 – AlainIb

+0

あなたは、イベントを持っていますあなたのスコープを読み書きすることができる親コントローラを持ち、ファクトリを使用しますが、スコープをリフレッシュするためにファクトリ内の変更を監視する必要があります。 – Walfrat

答えて

2

この質問はおそらく重複しています。このトピックの中で最もアップアップされた答えは、コントローラ間の通信にイベントを使用することについてたくさん話しています。私はイベントが正しいアプローチだとは思わない。

正解は共通のサービスです。

サービスを単純​​な値ストアとして作成するか、オブザーバブルのようなよりエレガントなパターンを使用して、コントローラ間で情報を渡すことができます。

function ValueStore() { 
    this._valueObject = {foo: 'initial value'}; 
} 

ValueStore.prototype.getValueObject = function() { 
    return this._valueObject; 
} 

ValueStore.prototype.setValueObject = function(valueObject) { 
    this._valueObject = valueObject; 
} 

angular.module('app').service('valueStore', ValueStore); 

コントローラでは、このサービスを注入してコントローラ間で値を取得して設定できます。更新された値を参照で取得できるように、値ではなくオブジェクトを渡すことをお勧めします。

あなたの実装は上記のコードと一致する必要はありません。必要に応じてプロパティを使用できます。アイデアは、サービスを使用してデータを渡すことです。非常に類似した質問への

UPDATE この回答How to communicate between controllers of two different modules in AngularJsは、サービスとオブジェクトの参照を使用して、2つのコントローラ間の通信の作業例を持っています。 $発し、$:

+1

これはそれだけでは機能しません。彼はスコープのコントローラーのデータを更新するために、工場の状態を監視する必要があります。 – Walfrat

+0

コードはこの領域を理解することが非常に少ないです。 jsfiddleで小さくても完全な作業コードで議論する方が良いでしょう。 –

+0

@Walfratこのサービスのアイデア(ファクトリパターンを使用していない)は、参照によってオブジェクトを使用することで、明示的にそれを見る必要がなくなります。 – Martin

関連する問題