Как правильно обрабатывать аннотацию AngularJS $ с Flowtype

Question

Я пытаюсь использовать Flowtype в проекте AngularJS (1.5), но он жалуется на $inject annotation. Каков правильный способ справиться с этим?

версия потока 0.30.0

Пример код

навигация/ссылка-controller.js

export default class LinksController { 

    constructor(navigationService) { 
    this.availableLinks = navigationService.availableLinks; 
    } 
} 

LinksController.$inject = ['NavigationService']; 

навигация/index.js

... 
import NavigationService from './navigation-service'; 
import LinksController from './links-controller'; 

export default angular.module('app.links', [uirouter]) 
    .config(routing) 
    .service('NavigationService', NavigationService) 
    .controller('LinksController', LinksController) 
    .name; 

Пример flowtype выход

LinksController.$inject = ['NavigationService']; 
       ^^^^^^^ property `$inject`. Property not found 

Answer 1

Причина этого в том, что, создав класс, вы определяете его интерфейс в потоке.

Когда вы назначаете $inject классу, вы фактически добавляете новое свойство, которое не было определено в интерфейсе класса, и это ошибка типа в потоке.

У вас есть два варианта сделать эту проверку типа в потоке:

Добавление статического определения типа недвижимости:

class LinksController { 
    static $inject: Array<string>; 
    constructor() {...} 
} 

LinksController.$inject = ['NavigationService']; 

Добавление статического свойства:

class LinksController { 
    static $inject = ['NavigationService']; 
    constructor() {...} 
} 

При втором варианте вам потребуется включить esproposal.class_static_fields=enable wit гин в [options] часть вашего .flowconfig

Поскольку это предложение еще не добавлены к стандартным JavaScript и не доступны в любых браузерах, вы также должны скомпилировать его с чем-то вроде Babel (вам нужно либо stage-2 preset или transform-class-properties plugin).

Answer 2

Если вы используете инъекции внешних зависимостей, то вы можете связать функции, как показано ниже.

angular 
    .module('app',[]) 
    .controller('LinkCtrl', LinkCtrl); 

LinkCtrl.$inject = ['NavigationService']; 

Можете ли вы, пожалуйста, поделиться своим полным лакером, если вы точно сделали это выше?