Question

似乎Angular没有提供内置的解决方案来定义具有属性和方法的类实例，而且它是开发人员构建它的。

在您看来，这样做的最佳做法是什么？如何将其与后端链接？

我收集的一些提示使用工厂服务和命名函数。

感谢您的见解

Answer 1

我认为与Object最接近的结构可能是factory，原因如下：

基本语法：

.factory('myFactory', function (anInjectable) {

  // This can be seen as a private function, since cannot
  // be accessed from outside of the factory 
  var privateFunction = function (data) {
    // do something 
    return data
  }

  // Here you can have some logic that will be run when 
  // you instantiate the factory
  var somethingUseful = anInjectable.get()
  var newThing = privateFunction(somethingUseful)

  // Here starts your public APIs (public methods)
  return {
    iAmTrue: function () {
      return true
    },

    iAmFalse: function () {
      return false
    },

    iAmConfused: function () {
      return null
    }
  }
})

然后你可以像标准对象一样使用它：

var obj = new myFactory()

// This will of course print 'true'
console.log( obj.iAmTrue() )

希望这有帮助，我完全知道角度模块的第一次影响可能非常激烈......

Answer 2

您将使用角度服务。

所有角度服务都是单例服务，可以注入任何控制器。

理想情况下，您只在控制器中保留对html的绑定/操作，其余逻辑将在您的服务中。

希望这有帮助。

Answer 3

我通过评估这个库得到了一些想法：https://github.com/FacultyCreative/ngActiveResource

然而，这个图书馆假设严格休息所以我不适合我。工作的是：

我创建了基础模型

var app = angular.module('app', []);

    app .factory('Model', function(){
        var _cache = {};  // holding existing instances 
        function Model() {
           var _primaryKey = 'ID',
               _this = this;

              _this.new = function(data) {
                 // Here is factory for creating instances or 
                 // extending existing ones with data provided
               }  

       }

       return Model;
});

比我简单的功能扩展“继承”

Function.prototype.inherits = function (base) {
        var _constructor;
        _constructor = this;
        return _constructor = base.apply(_constructor);
    };

现在我正在创建像这样的模型

app.factory('Blog', [
   'Model',
   '$http',
   function(Model, $http) {
     function Blog() {
      // my custom properties and computations goes here
      Object.defineProperty(this, 'MyComputed' , {
        get: function() { return this.Prop1 + this.Prop2  }
      });
     }

     // Set blog to inherits model
     Blog.inherits(Model);

    // My crud operations 

    Blog.get = function(id) {
     return $http.get('/some/url', {params: {id:id}}).then(function(response) {
       return Blog.new(response.data);
     });
    }

    return Blog;

   }
]);

最后，在控制器中使用它

app.controller('MyCtrl', [
   '$scope', 'Blog',
    function($scope, Blog) {
      Blog.get(...).then(function(blog) {
        $scope.blog = blog;
      });
    }
])

现在，我们的模型和扩展中还有更多内容，但这将是一个主要原则。我并不认为这是最好的方法，但我正在开发相当大的应用程序，它对我来说真的很棒。

注意：请注意我在这里输入了这段代码，可能有些错误，但主要原则在这里。

Answer 4

由于我的问题并没有真正反映我所面临的问题，我只是为了它而发布我的方法：正如Domokun所说，经验法则是前后分离。但由于我只是在构建原型并管理两端，因此我希望将内容保留在一个位置，让应用程序的其余部分使用中央信息作为服务。

我想在这里做的是通过包含模型字段的ng-repeat构建表单，最重要的是如何在表单中显示信息（例如＆＃39;姓氏＆＃39;而不是＆＃39;姓氏＆＃39）

因此，当我开始使用猫鼬模型时，我已经设法做了：

首先，可以通过app.get请求将模型的mongoose模式从节点侧传递到角度侧，并带有以下响应：

res.send(mongoose.model('resources').schema.paths);

这会吐出一个包含“资源”所有字段的对象。采集。最重要的是，我在模型中包含了一些额外的信息：

var resourceSchema = new Schema({
    _id: { type: Number },
    firstname: { type: String, display:'First name' },
    lastname: { type: String, display:'Last name' }
});

mongoose.model('resources', resourceSchema);

所以基本上我可以在角度方面对称地检索这个并且我需要映射这些字段并很好地显示它们。我似乎也可以描述验证，但我还没有。

对此方法的任何建设性反馈（无论是有效还是完全异端）都表示赞赏。

使用AngularJS的面向对象方法

4 个答案: