2

ディレクティブに配置された属性に基づいて動的コンテンツURLをレンダリングする角度ディレクティブを作成しようとしています。例:レンダリングされた文字列をAngularディレクティブに渡す

指令:

angular 
    .module('myModule') 
    .directive('myContent', directive); 

function directive() { 
    return { 
     replace: true, 
     templateUrl: function (elem, attrs) { 
      return attrs.contentUrl; 
     } 
    }; 
} 

HTML:

<div my-content content-url="url/to/my-content.html"></div> 

は、しかし、私が望むものを、コントローラからの文字列によって移入するcontent-url属性のためです。それでは、コントローラは、名前「ホーム」と「controllerAs」構文を使用している、私は読むためにHTMLをたいとしましょう:

しかしディレクティブのtemplateUrl関数内、 contentUrl属性は "として文字通り送られている
<div my-content content-url="{{home.myContent.url}}"></div> 

{{home.myContent.url}} " templateUrl関数を実行する前にこの値を評価するにはどうすればよいですか?または、ディレクティブからシンプルでダイナミックなコンテンツを入手するためのよりよい方法はありますか?

+0

がadding'scopeによって可能なはずNG-含ま:{conentUrl: '='} 'あなたのディレクティブの機能に、あなたのhtmlでそれを使用するとき中括弧を外します。それから$ directiveの$ scope.contentUrlの値を見る必要があります。また、$ attr。$ observeをディレクティブのlink関数で使用することもできますが、私はあまり経験がありません。 Googleはあなたの友人です:-) – cYrixmorten

+2

ng-includeでネイティブに何をしているのかを再現しようとしているようです。学習目的で再作成しない限り、ng-includeを使用します。それ以外の場合は、ソースコードをチェックしてソースコードの仕組みを確認することは悪い考えではないかもしれません。 –

答えて

0

答えは@ crhistian-ラミレスによって提供されています

だけ使用

<div ng-include="vm.myContent.url"></div> 
関連する問題