使用继承的类作为控制器时的问题

Question

主要依赖

• angular 1.4.7

• webpack 1.13.1

• babel-loader 6.2.4

简述

• B类继承自A类

• A类注入了$timeout

• B类除了$timeout之外还需要$state

• B中使用$state时为undefined

代码

class A {
  constructor ($timeout) {
    'ngInject';
    console.log('A');
  }
}

class B extends A {
  constructor ($timeout, $state) {
    super($timeout);
    console.log('B');
    console.log($timeout);
    console.log($state);
  }
}

var app = angular
  .module('app', ['ui.router'])
  .controller('B', B);

export default app.name;

webpack处理后

var A = function A($timeout) {
  'ngInject';

  _classCallCheck(this, A);

  console.log('A');
};
A.$inject = ["$timeout"];

var B = function (_A) {

  function B($timeout, $state) {

    _classCallCheck(this, B);

    var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(B).call(this, $timeout));

    console.log('B');
    console.log($timeout);
    console.log($state);
    return _this;
  }

  return B;
}(A);

---

考虑是babel对es6处理的导致请问哪位能够给我解释一下吗？

Answer 1

你确定你的问题是在ES6的继承上么？^^

我怎么觉着就是你少了依赖：

var app = angular
    .module('myApp', ['ui.router'])
    .controller('B', B);

Answer 2

原因已经找到了，需要来头鲸鱼补补脑。。

class B extends A {
  constructor ($timeout, $state) {
    'ngInject'; // 少了这句导致$state没有成功注入
    super($timeout);
    console.log('B');
    console.log($timeout);
    console.log($state);
  }
}