Компонент Angular 1.5 в Typescript не передает строку переменной привязки

Я использую Typescript с angular 1.5. У меня возникла проблема с передачей переменной компоненту привязки.

Вот соответствующий код - я удалил большую часть не относящегося к делу кода.

module xyz.dashboard {

class PatientPhaseCountController {

    public static $inject = [];

    public title: string;

    public chartType: string;

    ///// /* @ngInject */
    constructor() {
        this.title = 'Patient Phase Count';

        console.log(this.chartType);
        this.$onInit();
    }

    public $onInit(): void {
        console.log(this);
    };

}

class PatientPhaseCount implements ng.IComponentOptions {
    public bindings: any;
    public controller: any;
    public templateUrl: string;

    constructor() {
        this.bindings = {
            chartType: '@'
        };
        this.controller = PatientPhaseCountController;
        this.templateUrl = 'app/dashboard/patientPhaseCount/patientPhaseCount.component.html';
    }
}

}

и вот фрагмент html:

chartType is always undefined. Any help is appreciated.


angularjs angularjs-components
person Rich    schedule 28.12.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

У меня была аналогичная проблема, и мое решение заключалось в том, чтобы внедрить службу $scope в класс контроллера. $scope содержит контроллер, который по умолчанию называется $ctrl, и внутри $ctrl вы можете найти свои привязки. Итак, для вашего случая решение будет таким

    module xyz.dashboard {
      class PatientPhaseCountController {
         public static $inject = [];
         public title: string;
         public chartType: string;
         ///// /* @ngInject */
         constructor(private $scope:any) {
           this.title = 'Patient Phase Count';
           console.log(this.$scope.$ctrl.chartType);
           this.$onInit();
         }
         public $onInit(): void {
           console.log(this);
         };
       }

        class PatientPhaseCount implements ng.IComponentOptions {
        public bindings: any;
        public controller: any;
        public templateUrl: string;
        constructor() {
            this.bindings = {
                chartType: '@'
            };
            this.controller = ["$scope",($scope:any)=>{
               return new PatientPhaseCountController($scope);
            };
            this.templateUrl = 'app/dashboard/patientPhaseCount/patientPhaseCount.component.html';
        }  
      }
    }
person Pavel Tsybulivskyi    schedule 01.02.2017