angularjs - $injector.instantiate VS $injector.get VS $injector.invoke in angularjs

Question

$injector.instantiate有什么区别, $injector.get和 $injector.invoke在 AngularJS 中？

Answer 1

鉴于以下服务:

app.service('myService', function ($q, $http) {
  return {
    q:    $q,
    http: $http
  };
});

$injector.get(name, [caller]);

返回所请求服务的实例。

$injector.get('myService');
// { q: $q, http: $http }

$injector.invoke(fn, [self], [locals]);

调用提供的方法并从 $injector 传递给定的参数。

$injector.invoke(function (myService, $http) {
  console.log(myService); // { q: $q, http: $http };
  console.log(this);      // { v: 'im this!' };
  console.log($http);     // null
}, { v: 'im this!' }, { $http: null });

$injector.instantiate(Type, [locals]);

创建给定类型的新实例。接受一个构造函数，然后使用构造函数注释中指定的参数调用新实例。

假设以下“类”:

function Person (fName, lName, $http, $q) {
  return {
    first_name: fName,
    last_name:  lName,
    http: $http,
    q:    $q
  }
}

现在，如果我们想在我们的 Controller 中创建一个新的 Person，我们可以这样做:

app.controller('...', function ($injector) {
  var $http = $injector.get('$http');
  var $q    = $injector.get('$q');
  var p     = new Person('kasper', 'lewau', $http, $q);

  console.log(p); // { first_name: 'kasper', last_name: 'lewau', http: $http, q: $q };
});

想象 Person有大约 20 个依赖项，我们用 $injector.get 获取了每一个依赖项。方法。

麻烦!和 - 您需要保持参数和参数同步。啊。

相反，您可以这样做:

app.controller('...', function ($injector) {
  var p = $injector.instantiate(Person, {
    fName: 'kasper',
    lName: 'lewau'
  });
  console.log(p); // { first_name: 'kasper', last_name: 'lewau', http: $http, q: $q };
});

而且 - 如果我们愿意，我们可以为 .instantiate 提供本地人。调用，以覆盖内部 $injector.get()实例化时通常会得到。

var p = $injector.instantiate(Person, {
  fName: 'kasper',
  lName: 'lewau'
}, { $http: 'Nothing!', $q: 'Nothing!' });
console.log(p); // { first_name: 'kasper', last_name: 'lewau', http: 'Nothing!', q: 'Nothing!' };

我希望这可以解释三者之间的区别。如果您需要有关它们差异的更多信息，我会推荐这些文章:

http://taoofcode.net/studying-the-angular-injector/

http://taoofcode.net/studying-the-angular-injector-annotate/

http://taoofcode.net/studying-the-angular-injector-invoke/

http://taoofcode.net/studying-the-angular-injector-getservice/

http://taoofcode.net/studying-the-angular-js-injector-instantiate/