Question

我是使用angular的新手，并且有一个关于在角度中向对象添加行为的问题。

我有一个案例，其中我得到一个对象/或一组对象说人使用$http

var person =
    {
      id : 123,
      firstname : "james",
      lastname : "bond",
      username : "james00",
      profileGuid : "DSKFSJKFBSFBJBSFKJBAKBDS",
      projects : [
             {
                id : 1,
                name : "gold finger"
             }
       ] 
    }

我想添加像

这样的行为

 var spyBehavior = 
 {
    greet : function(){
        return this.lastname + " " + this.firstName + " " + this.lastName;
    },

    hasExperience : function(){
      this.projects && this.projects.length && this.projects.length > 0
    }
 }

目前我使用angular.extend(person, spyBehavior)

执行此操作

使用此类spyBehavior对象添加行为的优缺点是什么？
这应该被定义为角度服务吗？ - 在这种情况下，我放弃了this
这应该是在角度世界之外，并作为一个包装$ http输出的简单javascript对象存在吗？我该怎么做？

Answer 1

我认为你想要的是某种模式。我总是以下面的方式将我的模型定义为工厂，因为服务是单身。

angular.module('myApp').factory('User', function() {
  var _greet = function() {
    console.log("hello");
  };
  var User = function(data) {
    angular.extend(this, {
      email: null,
      name: null
      greet: _greet
    }, data);
  };
  return User;
});

然后，您可以在任何所需的模块中注入用户“模型”。如果您想获得该模型的新实例，只需执行

var user = new User(data);

遵循单一责任方法，这个对象有点愚蠢。它只知道它自己的属性，如何处理它们等等。如果您想添加一些行为，例如通过$http更新此对象，只需将$http服务注入您的用户模型并执行您想要的操作。请确保，不要与其他模型创建不必要的依赖关系。

Answer 2

我用来在Factory提供程序中定义原型对象：

angular.module('MyApp').factory('SpyBehaviour', function(){
    var SpyBehaviour = {
        greet : function(){
            return this.lastname + " " + this.firstName + " " + this.lastName;
        },

        hasExperience : function(){
            this.projects && this.projects.length && this.projects.length > 0
        }
    };

    return SpyBehaviour;
});

然后，我使用我的原型创建一个新对象，并使用$ http服务的结果扩展它。如果您使用transformResponse function，那么$http承诺将通过您的扩展对象得到解决。

$http.({
    method: 'GET',
    url: '/persons',
    transformResponse: function (data) {
        var persons = JSON.parse(data);

        return persons.map(function (person) {
            return angular.extend(
                Object.create(SpyBehaviour),
                person
            );
        });
    }
});

Answer 3

如果要从HTTP后端检索模型，AngularJS有一个名为transformResponse的很酷的功能。您可以为特定transformResponse来电指定$http功能。该函数将接收来自http请求的响应作为参数，根据您的实现操作它，然后返回它。当然，由于角度$resource建立在$http之上，因此您可以在两者中使用transformResponse。

简而言之，如果你想收到一大群人并用一些功能装饰它，这就是我要做的：

实施映射到您的API的People $resource;
实现一个函数，给定一组人，添加所需的行为。
将上述功能指定为人力资源的transformResponse参数。

你完成了。您在请求结束时将获得的是一系列具有附加功能的人员。您可以使用简单的$http请求执行相同的操作，transformResponse属性可以以相同的方式指定。

另见this short egghead.io tutorial。

以角度为javascript对象添加行为

3 个答案: