2015-12-13 2 views
1

Я пишу приложение AngleJS TypeScript и попал в стену. Мне нужно динамически применять контроллер к директиве, поскольку эта директива предоставляет динамический интерфейс для решения различных задач. Мне нужно иметь возможность динамически замещать в контроллере обработку различных действий в директиве.Совместное использование выделенной области с динамическим контроллером

я нашел информацию на How to set the dynamic controller for directives? что отвечает, как сделать это дает мне следующее:

export interface IHostScope extends ng.IScope { 
    type: string; 
    title: string; 
    subtitle: string; 
} 

export class Host implements ng.IDirective { 
    public templateUrl: "/some/template/url"; 
    public restrict: "E"; 
    public replace: true; 
    public controller = "@"; 
    public name = "controllerName"; 
    public scope: Object { 
    type: "@", 
    title: "@", 
    subtitle: "@" 
    }; 
    public link: Function = (scope: IHostScope, element: ng.IAugmentedJQuery, attrs: ng.IAttributes): void => { 
    //Stuff happens in here 
    } 
} 

export class ControllerA { 
    constructor(private: $scope: IHostScope, private $state: ng.ui.IStateService) { 
    //$scope and $state are null at runtime 
    } 
} 


module.directive("host", <any>Host); 
module.controller("ControllerA", ControllerA); 

Проблема в том, что во время выполнения, то $ государственного и $ значение сферы применения является недействительным и у меня нет никакого способа доступа существующие свойства для каждой из этих переменных, которые могли быть заданы функцией ссылки в директиве. Как я могу поделиться областью между директивой и динамическим контроллером и получить фактическое заполнение $ state?

ответ

0

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

В верхней части ControllerA перед конструктором добавить оператор $ INJECT как:

export class ControllerA { 
    static $inject = ["$scope", "$state"]; 
    constructor(private $scope: IHostScope, private $state: ng.ui.IStateService) { 
    //Do stuff - works like a charm 
    } 
} 
Смежные вопросы