angular ionic - 了解模型、工厂和服务

Question

我刚刚开始学习 ionic 和 angular，并且无法理解使用 factories/services 进行建模的含义。

场景：

我想为具有属性和方法的联系人对象建模。
我想要一个 AddressBook 对象，该对象具有包含联系人对象列表的属性，并且还具有方法。

从我读过的所有文献中，我想为联系人创建一个 factory/service，为地址簿创建一个。

但由于 Contact 是单例，我如何将这些东西放在一起？一旦我"create"一个新的联系人，因为是单例，不就是在原来的基础上做修改吗？

angular.module('blah.services', ['ionic.utils'])
.factory('Contact', function($q){
    var o = {
            "name" : '',
            "email" : ''
    };
    return o;
})
.factory('AddressBook', function($q, Contact){

   var o = {};
   o.contacts = [];

   o.addContact = function(contact){
      o.contacts.push(contact);
   }

   return o;
});

// and then somehwere something like
angular.module('blah.controllers', ['blah.services'])
.controller('somethingCtrl', function($scope, Contact, AddressBook) {

  /* what am i supposed to do here?
  is it something like
  var c = new Contact();
  c.name = 'foo';
  AddressBook.addContact(c);
  */

});

这是我已经读过但仍然无法理解的一些内容。

http://viralpatel.net/blogs/angularjs-service-factory-tutorial/
http://mcgivery.com/ionic-using-factories-and-web-services-for-dynamic-data/
https://docs.angularjs.org/guide/providers
angular.service vs angular.factory

Answer 1

我为你在这里的 OOP 思想鼓掌。这绝对是处理事情的好方法。不幸的是，您正在考虑 Classes 并且 ES5 目前不支持此功能。我对你的建议是不要放弃你拥有的这种方法，而是开始编写 ES6 代码并将其转换为 ES5。这样你可以使 Contacts 成为 Class 并且 AddressBook 确实包含一个数组 个联系人。

就 ES6 上的更多资源而言，您应该从以下链接查看一些转译垫片和插件：

Answer 2

出于某种原因，您认为 Angular 服务与它们的实际用途不同。在 Angular 情况下，它们仅用作 Angular 包含的依赖注入模式的元素。他们对面向对象没有发言权。

我的意思是，如果您有一个 "class" 函数 Contact（不是您创建的服务）：

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

那么您可以 var contact1 = new Contact("foo"); 并且 不需要 Angular 服务。

如果你想注入它们并稍后进行模拟测试，你可能仍然应该创建一个 Angular 可注入对象，但它只不过是一个函数值，所以你可以只使用 .value :

.value("Contact", function Contact(){...})
.controller("SomeCtrl", function($scope, Contact){
   $scope.contact1 = new Contact("foo");
}

Answer 3

/* what am i supposed to do here? is it something like var c = new Contact();

嗯，不，不是。您传递给控制器的 Contact 指的是您的工厂 returns，即您创建的对象 o。

您可能想要探索的另一种方法是创建一个 "model" 工厂和 return 一个具有 "Contact" 函数（您可以在控制器中实例化）和一个 "addressBook" 包含 "contacts" 数组的对象。例如：

angular.module('blah.services', ['ionic.utils'])

.factory('model', function($q){
    return {
        Contact : function(name, email) {
            this.name = name;
            this.email = email;
        },
        addressBook : {
            contacts: []
        }
    };
})

.controller('somethingCtrl', function($scope, model) {
    // Add a contact to the address book
    model.addressBook.push(new model.Contact("foo", "foo@bar"));
    // Now model.addressBook contains a new model.Contact
});

您还可以在工厂中将 contacts 数组创建为 local/private 变量（如在 return 语句外的 var contacts = []; 中）并添加自定义 getters/setters 在 addressBook 对象中对其进行操作。

angular ionic - 了解模型、工厂和服务

angular ionic - understanding models, factories and services

angularjs

ionic-framework

ionic