コントローラからのディレクティブテンプレート

Question

コントローラ変数に基づいてテンプレートにディレクティブをロードしようとしています。私がここで見てきた他の質問は、コントローラからそれを取得するのではなく、命令に渡される文字列に依存しています。

指令：

import {LanguageController} from "./language.controller.ts"; 

export class LanguageSelectDirective { 
    static NAME: string = "selectLanguage"; 


    static factory(): ng.IDirective { 

     let directive = { 
      restrict: "E", 
      link: function() {}, 
      templateUrl: function(elem, attrs){ 
       return "./" + attrs.language + "/language.html" 
      }, 
      scope: { 
       language: "@" 
      }, 
      controller: LanguageController, 
      controllerAs: "lc", 
      bindToController: true 
     }; 

     return directive; 
    } 
} 

コントローラー：

export class LanguageController{ 
    private selectedLanguage: String; 
    //More stuff 
} 

テンプレート：

<select-language ng-hide="authenticated" language="{{lc.selectedLanguage}}"></select-language> 

私はKEエラーEPのシーイングは次のとおりです。

GET http://localhost:3000/%7B%7Blc.selectedLanguage%7D%7D/language.html 404 (Not Found)

どのように私は、コントローラ変数としての代わりに、文字列リテラルとして言語パラメータを評価することを強制することができますか？

Answer 1

が

<select-language ng-hide="authenticated" language="lc.selectedLanguage"></select-language> 

を試してみてください...あなたがここ{{}}中括弧

を必要としない角度1.4を使用してplnkrです：http://plnkr.co/edit/HOjKKm

そしてここでは、ディレクティブの機能です：

let directive={ 
    return { 
     restrict: 'E', 
     scope: { 
     language: '=', //= not @ ensures the model value is interpreted 
     'content': '=' //we are binding to an object 
     }, 
     template: '<ng-include src="getTemplateUrl()"></ng-include>', 
     controller: function($scope){ 
     $scope.getTemplateUrl=function(){ 
      return $scope.language+'_language.html'; 
     } 
     } 
    } 
} 

Answer 2

{{}}を直接使用しないでくださいまた、スコープ定義で '='を使用します。

<select-language ng-hide="authenticated" language="lc.selectedLanguage"></select-language>