How to Add Controller In Angular Directive Class In Typescript

Question

Following is my angular directive class in typescript I have written so far:

My question is how I can add controller for this directive. I don't want to create new controller class and bind that controller with controller. I want to write the controller and inject the ISOLATE SCOPE inside the directive class in typescript

    module Sheet.Directive{
    class InputControl implements ng.IDirective {
    restrict = 'A';
    //require = 'ngModel';
    templateUrl = "../Templates/inputcontrol.html";



    constructor(private $location: ng.ILocationService) {
    }

    link = (scope: ng.IScope, element: ng.IAugmentedJQuery, attrs: ng.IAttributes, ctrl: any) => {
        console.log(this.$location);
    };

    static factory(): ng.IDirectiveFactory {
        const directive = ($location: ng.ILocationService) => new InputControl($location);
        directive.$inject = ['$location'];
        return directive;
    }
}

angular.module("SheetApp").directive("inputControl", InputControl.factory());
}

Valentyn Shybanov · Accepted Answer · 2015-12-13 00:57:13Z

1

You can actually declare property controller that will return a controller function, like:

export class App {
  restrict='E';
  templateUrl='src/app.html';
  scope = {
    a : '@'
  }
  controller = ['$scope',($scope) => {
    console.log("this this controller",$scope.a);
  }];
}

Here is example in Plunker: http://plnkr.co/edit/j4coAAZ207RHyGsqFPgC (I used my @directive trick for more convinient declaration of directives.

answered Dec 13, 2015 at 0:57

Valentyn Shybanov

19.4k7 gold badges68 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to Add Controller In Angular Directive Class In Typescript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related