Angular typescript directive scope empty

Question

I'm trying to implement a typescript directive, but I can't seem to pass my vars to the directive, this is my current directive

namespace app {
    'use strict';

    export interface IMyScope {
        // ngModel: Date;
        testing: string;
    }

    class DateTime implements angular.IDirective {
        public restrict: string = 'E';
        public template: string = '<div>Input: {{testing | json}}</div>';
        public scope: any = {
            testing: '='
        };

        // @ngInject
        controller: any = ($scope: IMyScope): void => {
            console.log($scope.testing);
        };

        link: any = (scope: IMyScope , 
                    element: angular.IAugmentedJQuery, 
                    attrs: angular.IAttributes, 
                    ctrl: any): void => {
            console.log(scope.testing);
        }
    }


    angular
        .module('app')
        .directive('dateTime', [() => new DateTime()]);
}

but the logs in my link and controller return undefined any clues why this is happening?

Radim Köhler · Accepted Answer · 2016-05-18 15:39:16Z

1

Your code seems to be working as is. There is a working plunker

Just, if the testing attribute is not set.. it has undefined value

date-time without attr testing
<date-time ></date-time>

date-time with attr testing="'xxx'"
<date-time testing="'xxx'"></date-time>

I.e. just set the testing attribute

answered May 18, 2016 at 15:39

Radim Köhler

124k48 gold badges243 silver badges343 bronze badges

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

1 Comment

Kiwi Over a year ago

Oh, ok I found what was wrong via your reply I typed testing="something" instead of testing="'something'" (note: the single quotes) ... :) thanks!!!

Collectives™ on Stack Overflow

Angular typescript directive scope empty

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related