Writing complex AngularJS directive in typescript

Question

I've found the following directive to select objects from checkboxes:
https://vitalets.github.io/checklist-model/

My problem is that we are using typescript and i have absolutely no idea how to write the given directive in typescript.

I know that the basic style is the following

module myModule {
    'use strict';
    export function checklistModel(): ng.IDirective {
        return {...};
   };
};

My problem is that I need the $parse and $compile services to get injected. I've tried to put the code from the directive in the link but I have no idea how to get the directive working.

Could someone please give me a hint on how to inject services and which part of the given code goes in the link and/or the compile?

Try to check this: Writing an Angular directive with a TypeScript class — Radim Köhler
– Radim Köhler, Commented Sep 11, 2015 at 11:59

charlieMACK · Accepted Answer · 2015-09-11 14:00:34Z

0

There is no specific issue with TypeScript regarding dependency injection. Simply define the dependencies you want to inject as parameters of checklistModel. If you want to ensure that the dependencies can be resolved after a minification of the javascript files, you can define the dependencies additionally via the $inject property (This will work in normal js as well):

module myModule {
'use strict';

    checklistModel.$inject = ['$parse', '$compile'];

    export function checklistModel($parse, $compile): ng.IDirective {
        return {
             link: function() { ... }
        };
   };

   angular.module('myModule').directive('checklistModel', checklistModel);
};

Everything else is normal angular stuff. (Beside that, the type IDirective will tell you how the return-value should look like)

I hope this will help.

answered Sep 11, 2015 at 14:00

charlieMACK

1751 silver badge10 bronze badges

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

Collectives™ on Stack Overflow

Writing complex AngularJS directive in typescript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related