角度型スクリプト指令のLinkメソッドが呼び出されない

Question

ログイン後に許可されたリソースがサーバーからロードされる役割ベースのアクセス制御システムを実装しようとしています。生のJavaScriptコードを使用してチェックすることができました。

angular.module('app').directive('accessControl', 
[ 
    'AuthService', function (authService) { 
     return { 
      restrict: 'A', 
      scope: "=", 
      link: function (scope, element, attrs) { 
       scope.canShow = function(resource) { 
        var allowedResources = authService.accountInfo.resources; 
        return allowedResources.indexOf(resource) !== -1; 
       } 

      } 
     } 
    } 
]); 

しかし、私のアプリケーション全体が活字体であることから、私は純粋な活字体でディレクティブを作成しようとしているが、残念ながら私はそうすることができません。ここに私のTSコードです。

export class AccessControl implements ng.IDirective { 

    public authService: App.AuthService; 
    public link: (scope: ng.IScope, element: ng.IAugmentedJQuery, attrs: ng.IAttributes) => void; 

    constructor(authService: App.AuthService) { 
     this.authService = authService; 
     console.log('authservice: ', authService); 
     AccessControl.prototype.link = (scope: ng.IScope, element: ng.IAugmentedJQuery, attrs: ng.IAttributes) => { 
      scope["canShow"] = function (resource: string) { 
       // some logic 
       console.log('can show' + resource); 
       return true; 
      }; 
     }; 
    } 

    public static factory(): ng.IDirectiveFactory { 
     var directive = (authService: App.AuthService) => { 
      return new AccessControl(authService); 
     }; 

     directive['$inject'] = ['AuthService']; 
     return directive; 
    } 

    restrict = "A"; 
    scope: "="; 
} 

angular.module('app').directive('accessControl', AccessControl.factory()); 

リンク機能が呼び出されません。 ヘルプやポインタは高く評価されます。

Answer 1

私たちはいつも、クラスの公開関数としてlinkを宣言しています。独立スコープを使用している場合（スコープ変数またはメソッドがそれぞれ渡されたオブジェクトの場合）は、ディレクティブクラスにpublic scope変数は必要ありません。また、$injectは、使用しているブラケットのプロパティ表記なしでdirectiveに直接設定することもできます。 TypeScriptでディレクティブを作成した方法は次のとおりです。

namespace app.directives { 
    export class AccessControl implements ng.IDirective { 

     public restrict = "A"; 

     constructor(private authService: App.AuthService) { 
      console.log("authservice: ", this.authService); 
     } 

     public link(scope: ng.IScope, 
        element: ng.IAugmentedJQuery, 
        attrs: ng.IAttributes) { 
      console.log("in link function of directive", scope); 
     } 

     public static factory(): ng.IDirectiveFactory { 
      var directive = (authService: App.AuthService) => { 
       return new AccessControl(authService); 
      }; 

      directive.$inject = ["AuthService"]; 
      return directive; 
     } 
    } 

    angular.module("app") 
     .directive("accessControl", AccessControl.factory()); 
}