Угловой js $ parse не работает

Question

Я написал директиву, используя машинопись. вот моя директива ниже.

'use strict'; 

    module App.Directives { 

    interface IPageModal extends ng.IDirective { 
    } 

    interface IPageModalScope extends ng.IScope { 

    } 

    class PageModal implements IPageModal { 
     static directiveId: string = 'pageModal'; 
     restrict: string = "A"; 

     constructor(private $parse: ng.IParseService) { 

     } 

     link = (scope: IPageModalScope, element, attrs) => { 

      element.click((event) => { 
       event.preventDefault(); 

       var options = { 
        backdrop: 'static', 
        keyboard: false 
       }; 

       event.openModal = function() { 
        $('#' + attrs['targetModal']).modal(options); 
       }; 
       event.showModal = function() { 
        $('#' + attrs['targetModal']).modal('show'); 
       }; 
       event.closeModal = function() { 
        $('#' + attrs['targetModal']).modal('hide'); 
       }; 
       var fn = this.$parse(attrs['pageModal']); 
       fn(scope, { $event: event }); 
      }); 
     } 
    } 

    //References angular app 
    app.directive(PageModal.directiveId, ['$parse', $parse => new PageModal($parse)]); 
} 

Использование в HTML

<button class="btn blue-grey-900" target-modal="emplpyeeViewModal" page-modal="vm.addEmployee($event)"> 
    <i class="icon-plus m-b-xs"></i> 
</button> 

использования в контроллере

addEmployee($event) { 
    $event.openModal(); 
}; 

Эта линия не работает. var fn = this.$parse(attrs['pageModal']);. Я не понимаю, что случилось. Ошибка

это. $ Parse undefined. и служба называется два раза

Answer 1

Это довольно тривиально: Ваш this является не ваша class'es сферы, поскольку function openmodal(event) { определяет самостоятельно.

Объявите функцию на уровне класса или используйте функцию стрелки, например,

link = (scope: IPageModalScope, element, attrs) => { 
    element.click((event) => { 
     event.preventDefault(); 

     var options = { 
      backdrop: 'static', 
      keyboard: false 
     }; 

     event.openModal = function() { 
      $('#' + attrs['targetModal']).modal(options); 
     }; 
     event.showModal = function() { 
      $('#' + attrs['targetModal']).modal('show'); 
     }; 
     event.closeModal = function() { 
      $('#' + attrs['targetModal']).modal('hide'); 
     }; 
     var fn = this.$parse(attrs['pageModal']);//does not work here 
     fn(scope, { $event: event }); 
    }); 
}