将服务注入控制器失败Angular

时间:2016-11-07 16:17:03

标签: javascript angularjs ecmascript-6

我有这样的结构:SimpleController依赖于SimpleService,取决于APIService。

当我试图将SimpleService注入控制器时,它会失败并抛出此错误:

  

vendor.js:27948错误:[ng:areq]参数'fn'不是函数,未定义   http://errors.angularjs.org/1.5.5/ng/areq?p0=fn&p1=not%20a%20function%2C%20got%20undefined       在vendor.js:14466       在assertArg(vendor.js:16278)       在assertArgFn(vendor.js:16288)       在Function.annotate [as $$ annotate](vendor.js:18318)       at injectionArgs(vendor.js:19024)       at Object.instantiate(vendor.js:19075)       在对象。 (vendor.js:18918)       at Object.invoke(vendor.js:19063)       at Object.enforcedReturnValue [as $ get](vendor.js:18902)       at Object.invoke(vendor.js:19063)(匿名函数)@ vendor.js:27948(匿名函数)@ vendor.js:24623 $ digest @ vendor.js:31489 $ apply @ vendor.js:31735done @ vendor。 js:25970completeRequest @ vendor.js:26176requestLoaded @ vendor.js:26109

它没有给我任何意义,它在这个函数中抛出错误,这与我在我的代码中所做的任何事情完全无关:

 function consoleLog(type) {
  var console = $window.console || {},
      logFn = console[type] || console.log || noop,
      hasApply = false;

  // Note: reading logFn.apply throws an error in IE11 in IE8 document mode.
  // The reason behind this is that console.log has type "object" in IE8...
  try {
    hasApply = !!logFn.apply;
  } catch (e) {}

  if (hasApply) {
    return function() {
      var args = [];
      forEach(arguments, function(arg) {
        args.push(formatError(arg));
      });
      return logFn.apply(console, args);
    };
  }

  // we are IE which either doesn't have window.console => this is noop and we do nothing,
  // or we are IE where console.log doesn't have apply so we log at least first 2 args
  return function(arg1, arg2) {
    logFn(arg1, arg2 == null ? '' : arg2);
  };
}

我的APIService:

export class APIService {
  constructor($http) {
    this.$http = $http;
  }

  requestApi(url) {
  }
}

APIService模块:

import angular from 'angular';

import APIService from './apiService.service';

export default angular.module('acme.services.api', [])
  .service('apiService', APIService)
  .name;

SimpleService:

export class SimpleService {
  constructor(apiService) {
    this.service = apiService;
  }
}

SimpleService模块:

import angular from 'angular';

import apiService from 'services/api/apiService';

import { simpleService } from './simpleService.service';

export default angular.module('acme.services.simpleService', [apiService])
  .service('socialWallService', simpleService)
  .name;

SimpleController:

export class SimpleController {
  /* @ngInject */
  constructor($scope, $element, $animate, $sce, $attrs, simpleService) {
    this.$scope = $scope;
    this.$element = $element;
    this.$animate = $animate;
    this.simpleService = simpleService;
  }
}

和SimpleController指令

import { SimpleController } from './simple.controller';

export const simpleDirective = () => ({
  restrict: 'E',
  bindToController: true,
  scope: true,
  controller: SimpleController,
  controllerAs: '$ctrl',
});

和SimpleController模块

import angular from 'angular';
import ngAnimate from 'angular-animate';
import simpleService from 'services/simple/simple';
import { simpleDirective } from './simple.directive';

export default angular.module('acme.organisms.simple', [ngAnimate, simpleService])
  .directive('simple', simpleDirective)
  .name;

有什么想法吗?

如果我删除SimpleService上的依赖项,则不会发生错误,项目工作正常。

0 个答案:

没有答案