Question

我正在编写一个有点复杂的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控制器。这里最好的做法是什么？

谢谢！

Answer 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

Answer 2

您应该使用服务进行此类数据共享，您正在做的事情将变得比需要的复杂得多，而角度框架已经拥有您需要的共享工具

然后，您可以将服务作为依赖项注入任何需要它的控制器，指令或其他服务

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
});

将$ scope注入子模型？

2 个答案: