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'...想要将逻辑抽象为可以使用的函数是很常见的，但谷歌搜索在这里似乎没有帮助我。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;
}

看到这个Plunker

于 2013-10-31T18:34:21.077 回答