0

やや複雑な angularjs アプリケーションを作成しています。私が見つけたのは、私のメインコントローラーモデルは、他のコントローラーによって使用される自己完結型の関数であるいくつかのオブジェクトで実際に構成されている必要があるということです。これは通常は問題になりませんが、これらのオブジェクトは、プロパティが更新されたことを認識できる必要があります。$scope をモデル オブジェクトに渡すと、次のように $watch 関数を呼び出すことができると考えました。

function MyCtrl($scope){
    $scope.myModel = new MyModel($scope);
    //Do Ctrl Stuff
}

function MyModel($scope){
    $scope.X = 2;
    $scope.Y = 3;
    $scope.$watch('Y', function(oldVal, newVal){
        //do something important
    });
}

MyCtrl が $scope.myModel.Y の値を変更しても、何も起こりません。実際、MyModel は $watch('myModel.Y'... のようにウォッチをフォーマットする必要があるようです... これは、MyCtrl がそれを $scope にどのように割り当てたかを知る必要があるため、抽象化にはあまり役に立ちません。使用できる関数にロジックを抽象化することは一般的ですが、Google 検索はここでは役に立たないようです. MyModel は実際には適切なサイズのモジュールであり、他のモジュールで使用する場合はできるだけ DRY のままにしたいと考えています.ここでのベストプラクティスは何ですか?

ありがとう！

4

2 に答える 2

1

この種のデータ共有にはサービスを使用する必要があります。実行していることは必要以上に複雑になり、Angular フレームワークには必要な共有ツールが既に用意されています。

次に、サービスを必要とするコントローラー、ディレクティブ、またはその他のサービスに依存関係として挿入できます。

var app=angular.module('myApp',[]);

app.factory('myDataService',function(){
  return {
    data: {x:2,y:3} ;
     updateData:function( x,y){
          this.data.x=x; 
          this.data.y=y;
     } 
  }
});

app.controller('myCtrl',function($scope, myDataService){
   $scope.data=myDataService.data; 
    $scope.onMyButtonClick=function( x, y){
         myDataService.upDateData(x,y);
    })
});

app.controller('myOtherCtrl',function($scope, myDataService){
  /* when updates made in other controller will automatically be reflected here*/
   $scope.data=myDataService.data
});
于 2013-10-31T18:41:44.177 に答える
1

MyCtrlから使用したい場合、関数 MyModel は$scopeを返す必要があります。

function MyCtrl($scope){
    $scope.myModel = new MyModel($scope);
    //Do Ctrl Stuff
}

function MyModel($scope){
    scope = $scope.$new(); //Creates a new isolated scope
    scope.X = 2;
    scope.Y = 3;
    scope.$watch('Y', function(oldVal, newVal){
        console.log(oldVal, newVal);
    });
    return scope;
}

このプランカーを見る

于 2013-10-31T18:34:21.077 に答える