javascript - AngularJS 组件 - 带有 Typescript 的 ngModelController

Question

我有以下(简化的)指令，我想用 Typescript 编写它(仍然不是 Angular 2.0)。

 angular
        .module('app.components')
        .directive('list', List);

    function List() {
        return {
            restrict: 'E',
            templateUrl: 'modules/components/List/List.html',
            controller: ListController,
            controllerAs: 'vm',
            require: ['ngModel', '?^form'],
            bindToController: true,
            link: LinkFunction,
            scope: {
                'id': '@',
                'name': '@'
            }
        };

        function LinkFunction(scope, element, attrs, controllers) {
            var ngModelCtrl = controllers[0];
            var formCtrl = controllers[1];

            ngModelCtrl.$isEmpty = function(value) {
                return !value || value.length === 0;
            };

            ngModelCtrl.$render = function() {
                scope.vm.form = formCtrl;
                scope.vm.model = ngModelCtrl;
                scope.vm.selected = ngModelCtrl.$modelValue;
            };

            // ... more controller functions
    }
})();

现在，如何将 Controller 注入(inject)到我的 Typescript 代码中:

const template = require('./List.html');

export default class ListComponent{
    static selector = 'list';
    static definition: ng.IComponentOptions = {
        template: template,
        controller: ListComponent,
        bindings: {
            'id': '@',
            'name': '@'
        }
    };

    id;
    name;

    constructor(private controllers) {  // <-- not working
        'ngInject';
    }

    $onInit() {
        let ngModelCtrl = this.controllers[0];
        let formCtrl = this.controllers[1];

        ngModelCtrl.$isEmpty = function(value) {
            return !value || value.length === 0;
        };

        ngModelCtrl.$render = function() {
            this.model = ngModelCtrl;
            this.form = formCtrl;
            this.selected = ngModelCtrl.$modelValue;
        };
    }
}

希望有人知道答案，或者可以给我提示如何实现我的目标，因为我在网上搜索了几个小时，但没有找到任何解决方案。

Answer 1

使用“require”，如此处所述 https://docs.angularjs.org/guide/component请参阅组件间通信