Question

我使用了Yeoman Angular-Fullstack生成器来创建一个新组件，我试图将Modal服务注入其中。

ng-annotate用于注入服务但是我得到了这个：

错误：[$ injector：strictdi] CampaignsComponent未使用显式注释，无法在严格模式下调用

控制器如下所示：

'use strict';
const angular = require('angular');
const uiRouter = require('angular-ui-router');
import routes from './campaigns.routes';

export class CampaignsComponent {
  /*@ngInject*/
  constructor(Modal) {
    console.log('campaigns');
          this.confirmDelete = Modal.confirm.delete();

  }
}
// CampaignsComponent.$inject['Modal'];
export default angular.module('myApp.campaigns', [uiRouter])
  .config(routes)
  .component('campaigns', {
    template: require('./campaigns.html'),
    controller: CampaignsComponent,
    controllerAs: 'campaignsCtrl'
  })
  .name;

生成器自动搭建一个看起来像这样的组件：

import angular from 'angular';
import uiRouter from 'angular-ui-router';
import routing from './main.routes';

export class MainController {

  /*@ngInject*/
  constructor($http) {
    this.$http = $http;
    console.log('main')
  }

  $onInit() {
    this.$http.get('/api/things')
      .then(response => {
        this.awesomeThings = response.data;
      });
  }

  addThing() {
    if (this.newThing) {
      this.$http.post('/api/things', {
        name: this.newThing
      });
      this.newThing = '';
    }
  }

  deleteThing(thing) {
    this.$http.delete('/api/things/' + thing._id);
  }
}

export default angular.module('myApp.main', [uiRouter])
  .config(routing)
  .component('main', {
    template: require('./main.html'),
    controller: MainController
  })
  .name;

尝试将$ http注入广告系列控制器，例如

  /*@ngInject*/
  constructor($http) {
    this.$http = $http;
    console.log('main')
  }

仍然会导致同样的错误，因此此时此刻并未归结为Modal服务而且我完全被难倒了。

Answer 1

您可以使用$inject属性修复此错误。基本上，您的问题的解决方案是注入'$http'依赖项。

CampaignsComponent.$inject['$http'];

尝试调用未明确注释的函数或提供程序时，如果应用程序在启用了严格模式的情况下运行，则会发生此错误。您可以阅读详细信息here。

Answer 2

将以下方法添加到MainController类：

$onInit(){}

如何在Angular-Fullstack生成的Angular 1.5组件中注入依赖项

2 个答案: