AngularJS中的通用getterSetter

时间:2015-05-18 14:42:22

标签: javascript angularjs

Documentation对于ngModel有一个getterSetter示例:

angular.module('getterSetterExample', [])
.controller('ExampleController', ['$scope', function($scope) {
  var _name = 'Brian';
  $scope.user = {
    name: function(newName) {
     // Note that newName can be undefined for two reasons:
     // 1. Because it is called as a getter and thus called with no arguments
     // 2. Because the property should actually be set to undefined. This happens e.g. if the
     //    input is invalid
     return arguments.length ? (_name = newName) : _name;
    }
  };
}]);

这正是我所需要的,但我不想在不同的背景下反复写这部分。 是否可以创建通用的getterSetter?喜欢

$scope.user.name = nameGetterSetter;

我无法看到该全局函数如何在不通过范围的情况下获取或设置任何特定实例。

2 个答案:

答案 0 :(得分:2)

在我看来,您实际上并不需要使用getterSetter。为处理用户创建单独的模型会更有用。一种方法是创建一个Angular服务。这是一个人为的例子:

// I'm using a separate module, but you don't have to
angular.module('user').factory('User', function() {

    function User(name) {
        this.name = name;
    }

    return User;

});

现在,如果我们回到您的代码:

angular.module('getterSetterExample', ['user'])
  .controller('ExampleController', ['$scope', 'User', function($scope, User) {
      $scope.user = new User('Brian');
  }]);

我注入了我的"用户工厂"到控制器然后用它来创建用户模型。如果需要,您可以将服务注入多个控制器。我建议您阅读services

如果您正在使用REST API,请查看ngResource。它提供了一些检索和存储数据的通用功能。

答案 1 :(得分:1)

尝试类似:

Sharer.js:

  myApp.factory('mySharer', [function () {
    var myField = 'Initialized';

    return {
        getProperty: function() {
            return myField;
        },
        setProperty: function(value) {
            myField = value;
            return myField;
        }
    };
  }]);

Controller.js:

myApp.controller("myController", ["$scope","mySharer",        
                                      function($scope, mySharer){

        $scope.myField='HellYeah!';
        mySharer.setProperty($scope.myField);

}]);

希望我一直很有帮助。