Question

我是angularJS的新手并且通过角度docs。我遇到了这一行 controllers are created using a factory function

我试图找到这意味着什么，并找到了什么是工厂，服务和提供商，但这不适合这里。如何使用工厂函数创建控制器？

请解释工厂在此背景下的含义。

Answer 1

这意味着您为AngularJS提供了一个函数，它可以执行生成控制器实例所需的次数。因此，请从您链接到的页面中获取示例：

angular.module('invoice3', ['finance3'])
.controller('InvoiceController', ['currencyConverter', function(currencyConverter) {
  this.qty = 1;
  this.cost = 2;
  this.inCurr = 'EUR';
  this.currencies = currencyConverter.currencies;

  this.total = function total(outCurr) {
    return currencyConverter.convert(this.qty * this.cost, this.inCurr, outCurr);
  };
  this.pay = function pay() {
    window.alert("Thanks!");
  };
}]);

从第2行开始，function(currencyConverter) {的那个函数是工厂函数。

每当页面的位置使用InvoiceController时，AngularJS将（基本上）使用该工厂函数执行以下操作，并传入它具有的任何依赖项：

var currencyConverter = ...; // obtain a currency converter from the factory
var theController = new thatFactoryFunction(currencyConverter);

然后它将使用作为控制器返回的值。它将为每个InvoiceController指示页面单独执行此操作，为每个页面创建单独的实例。

（我强调上面的代码纯粹是AngularJS正在做的插图而不是它使用的代码的实际表示。）

Answer 2

您所指的上一部分中缺少的关键引用是：

“首先，有一个新的JavaScript文件包含一个所谓的”控制器“。更准确地说，该文件包含一个构造函数，用于创建实际的控制器实例。”

如果这是一个实际的角度工厂，它会更有意义。但是，控制器就像Angular工厂，服务和提供商一样。

工厂，实际上是一个Javascript设计模式，maybe reading here it will make more sense.

要使控制器工作，必须存在实例才能进行双向绑定。基本上，创建了一个控制器实例。角度控制器页面解释得很好：

“当Controller通过ng-controller指令附加到DOM时，Angular将使用指定的Controller的构造函数实例化一个新的Controller对象。一个新的子作用域将作为Controller的构造函数的可注入参数提供作为$ scope。“ Here's the link.

如果是控制器，你很可能会在$ scope上存储项目而不是'this'。因此，他们将控制器与工厂分开，因为他们不会返回自己的可访问实例，而是通过$ scope或'this'将其属性绑定到视图。

要清楚，我不是说他们指的是Angular工厂。我认为这种措辞的原因与for the service factory function：

相同

“应用程序开发人员可以通过使用Angular模块注册服务的名称和服务工厂函数来定义自己的服务。

服务工厂函数生成表示应用程序其余部分服务的单个对象或函数。服务返回的对象或函数被注入到指定服务依赖性的任何组件（控制器，服务，过滤器或指令）中。“

他们举了这个例子：

var myModule = angular.module('myModule', []);
myModule.factory('serviceId', function() {
  var shinyNewServiceInstance;
  // factory function body that constructs shinyNewServiceInstance
  return shinyNewServiceInstance;
});

因此，当您看到他们说是从工厂函数创建时，他们只是说使用以下模式：

.controller('PersonCtrl', [
  'PersonFactory'
  function(PersonFactory) {
    this.name = 'Tom';
    console.log(PersonFactory.name); //would print 'Tom'
}]);

.factory("PersonFactory", [
  function () {
    return {
      name: 'Tom'
    };
}]);

我希望这有帮助，或者可能有人可以在我的解释中更简洁并编辑此说明。

Answer 3

创建控制器实例很有意思。可以预期它是用new InvoiceController(...)创建的，并且它也是由句子建议的。更准确地说，该文件包含一个构造函数，它创建了实际的控制器实例，但是＆事实并非如此。实际上它是这样创建的：

instance = Object.create(controllerPrototype);

以后构造函数被调用为函数：

return fn.apply(self, args); //self == instance

老实说，我们只能猜测作者对工厂功能的意义。可能是控制器不是由new创建的。也许构造函数因此被称为工厂或它是内部工厂函数。它也可能只是糟糕的措辞甚至是错误。

控制器是使用工厂功能创建的？

3 个答案: