2017-04-17 12 views
0

データベースからディレクティブが入力されています。 Wordpressでのショートコードの動作と同様に、ユーザーはこれらのカスタムギャラリーをここに挿入する必要があります。私はいくつかの方法を試しました。それらはコンパイルされますが、ページ上のHTMLには影響しません。私は何が欠けていますか?データベースからの着信AngularJS - データベースからロードされたディレクティブはテンプレートに置き換えられません

<p>Lorem Ipsum. Some content here</p> 
<div work-gallery friendly="bq"></div> 

私はテンプレートを使用して、「ワークギャラリー」属性でそのDIVを交換したいと思います。私のページのスコープにそのコンテンツを読み込むと、私はそれをコンパイルして、私のディレクティブがトリガーするようにします。コントローラから

$compile($scope.page.content)($scope); 

このディレクティブをトリガし、それが右のそれを追加したり、それを交換してからちょうどフロントエンドには表示されませんする必要がどこまでコンパイルします。ダイナミックに読み込まれたコンテンツの外側にそのDIVを追加すると、動作します。私はのinnerTextまで通じ掘る場合

指令

app.directive('workGallery', function ($compile) { 
    var template = '<div>TEST{{page.med.length}}</div>'; 

    return { 
     restrict: 'A', 
     replace: true, 
     link: function (scope, ele, attrs) { 
      scope.page.med = [1, 2]; 
      scope.$watch(attrs.friendly, function() { 
       ele.html(template); 
       $compile(ele.contents())(scope); 
       console.log(ele); 
       ele.append(ele.contents()); 
      }); 
     } 
    }; 
}); 

検査「要素は、」TEST2を明らかにするが、それは私が得るすべてです。どんな助けもありがとう!私が理解していることから、これは私のコンテンツの中に "TEST2"を加えるべきです。出力

<p>Lorem Ipsum. Some content here</p> 
<div work-gallery friendly="bq">TEST2</div> 

すべてのヘルプは高く評価され期待

答えて

0

私は属性を見てについて何か問題があると思い、試してみてください。

attrs.$observe('friendly', function(val){ 
    /* .... */ 
}); 
+0

私は同意するが、これはSO上の別のデモに基づいていました。これは、データが元のDIVを費やしたり置き換えたりしていないという事実に依然として役立ちません。しかし、入力をありがとう! –

関連する問題