AngularJS & Typescript: Как да присвоите клас/тип като контролер на директива?

AngularJS директивите определят контролер, използвайки:

{
  controller: function ($scope){}
}

Досега не съм намерил начин, по който мога да създам клас TypeScript и да го присвоя на свойството на контролера на директива.

Това, което бих искал да направя, е нещо подобно

interface IDirectiveController{
    myProperty:string;
}

class DirectiveController implements IDirectiveController{
   static $injector = [$scope];
   constructor ($scope:ng.IScope){
       this.myProperty = 'default';
   }

   public myProperty:string;
}


var directive:ng.IDirective =
{
   controller:DirectiveController;
}
return directive;

Още по-добре, би било хубаво, ако може да се използва фабрична функция, която да ми позволи да създам и върна нов екземпляр на контролера, подобно на това как се инстанцира самата директива.

В моя шаблон на директива бих искал също да се обвържа директно към контролера, вместо да се налага да присвоявам свойствата на класа на $scope.

Друг начин да заявя това може да е да кажа, че бих искал да мога да присвоявам контролери на директиви по начин, подобен на присвояването на контролер, използвайки синтаксиса myController as ContollerType, който е наличен в шаблон.


typescript angularjs angularjs-directive angularjs-controller
person Richard Collette    schedule 16.03.2014    source източник

Отговори (2)


arrow_upward
3
arrow_downward

Вярвам, че бихте могли да направите нещо подобно във вашата директива:

...
controller: DirectiveController,
controllerAs: 'myCtrl'
...

След това angular трябва да инстанцира вашия клас с неговия конструктор и можете да се обърнете към него в шаблона с myCtrl

person rob    schedule 16.03.2014
comment
Уау, това е заровено в документацията. Ако търсите в Google: controllerAs site:angularjs.org, получавате само $route и $compile документация. Въпреки това се обсъжда на много други места, особено в StackOverflow. - person Richard Collette; 17.03.2014
comment
Да, потърсих документ за него и намерих само малък абзац, който всъщност не го обяснява. Трябваше да потърся в StackOverflow, за да получа пример за това. - person rob; 17.03.2014

arrow_upward
2
arrow_downward

Просто направете това, което бихте направили при липса на директива, т.е.:

class DirectiveController{
   static $inject = ['$scope']; // fixed a few typos here
   constructor ($scope){
       $scope.vm = this;        // this is the pattern I recommend for all controllers
       this.myProperty = 'default';
   }

   public myProperty:string;
}

За да научите повече за този модел, вижте: http://www.youtube.com/watch?v=WdtVn_8K17E&hd=1

person basarat    schedule 17.03.2014
comment
Забравих за стария метод за добавяне на контролера към обхвата по този начин. Не започнах да използвам AngularJS, докато вече нямаха ключовата дума as за присвояване на контролер. Страхотни видеоклипове между другото basarat. Ще трябва да се върна и да видя дали имате нови, откакто гледах последно. Никога нямаше да стигна толкова далеч с typescript/angular без тях. Трябва да се обърнете към Pluralsight, за да съставите напълно създаден курс. Опцията controllerAs е по-чистият (или поне по-декларативният) начин за това, така че маркирам това като отговор. - person Richard Collette; 17.03.2014