Question

在我的控制器中，我有几个与$ scope相关的本地函数。随着这个数字的增加，他们现在似乎失控了。构造这些本地控制器功能的正确模式是什么？

例如，

function myController($scope) {
    $scope.func1 = function() {
        // do something with $scope
    }
    $scope.func2 = function() {
        // do something with $scope
    }
    $scope.func3 = function() {
        // do something with $scope
    }

    // ... controller code here ...
}

有没有一种方法可以使这些本地func1，func2，func3更易于管理？

Answer 1

您可以将控制器定义为类，并使用原型添加功能：

var myController = function($scope){
  var _this = this;

  $scope.func1= function(){
    _this.func1();
  };
};

myController.prototype.func1 = function(){
  // do something here
};

app.controller('myController', myController);

这样你就可以避免“范围汤”。有一篇很棒的文章here

请注意，您还可以使用“as”关键字来避免$ scope：

<div ng-controller="myController as ctrl">
   <input ng-click="ctrl.func1()">
</div>

var myController = function(){
    this.someVar = "A value";
};
myController.prototype.func1 = function(){
   // do something here
};

Answer 2

我可以分享我的方法：

function myController($scope) {

     $scope.func1 = func1;
     $scope.func2 = func2;


    func1 = function() {

    }
    func2 = function(x) {
        // do something with x
    }
}

当我调用func2时，我给它$ scope.whatever我需要的东西，这样我就可以将我的$ scope保留在我的函数体内。

控制器中本地$ scope函数的正确模式是什么？

2 个答案: