Инъекция не работает с ng-annotate и babel на Angular 1.X

Я использую кодовый стиль ES6 и реализую пример модуля следующим образом:

import angular from 'angular';
import { IndicatorSelectorComponent } from './indicatorSelector.component';
import './indicatorSelector.css';

export const IndicatorSelectorModule = angular
  .module('indicatorSelector', [])
  .component('indicatorSelector', IndicatorSelectorComponent)
  .name;

с этим кодом для компонента:

import templateUrl from './indicatorSelector.html';

export const IndicatorSelectorComponent = {
  templateUrl,
  controller: class IndicatorSelectorComponent {
    contructor($http) {
      'ngInject';
      this.$http = $http;
    }

    $onInit() {
      console.log(this.$http);
    }
  }
}

Console.log(this.$ Http) возвращает значение undefined. Я подозревал, что проблема была с моим кодом веб-пакета и ng-annotate, но я вижу, что сгенерированный пакет включает аннотацию:

var IndicatorSelectorComponent = exports.IndicatorSelectorComponent = {
  templateUrl: _indicatorSelector2.default,
  controller: function () {
    function IndicatorSelectorComponent() {
      _classCallCheck(this, IndicatorSelectorComponent);
    }

    _createClass(IndicatorSelectorComponent, [{
      key: 'contructor',
      value: ["$http", function contructor($http) { // <==== HERE!
        'ngInject';

        this.$http = $http;
      }]
    }, {
      key: '$onInit',
      value: function $onInit() {
        console.log(this.$http);
      }
    }]);

    return IndicatorSelectorComponent;
  }()
};

Но все равно это не работает. Я пытался проверить по коду модуля console.log(IndicatorSelectorComponent);

Я вижу, что $inject пуст. Я не знаю, что еще делать. Я ценю любую помощь в этом.

Object
controller :function IndicatorSelectorComponent()
$inject :Array[0]
arguments : (...)
caller : (...)
length : 0
name : "IndicatorSelectorComponent"
prototype : Object
__proto__ : function ()
[[FunctionLocation]] : indicatorSelector.component.js:5
[[Scopes]] : Scopes[3]
templateUrl : "C:/Projetos/IndicadoresPCM/client/src/app/components/goals/indicatorSelector/indicatorSelector.html"
__proto__ : Object

1 ответ

Если использовать этот способ, он будет работать.

import templateUrl from './indicatorSelector.html';

export const IndicatorSelectorComponent = {
  templateUrl,
  controller: function ($http) {
    "ngInject";
    this.$onInit = function () {
      console.log($http);
    };
  }
}

Но все же было бы очень интересно заставить его работать с выражением класса...

Другие вопросы по тегам