テンプレートとコントローラを使った角型動的要素

Question

テンプレートファイルとコントローラを使ってHTMLをクリックした後、動的コンテンツを追加する方法を理解できません。

私のようなものにしたい：

element.click(function(){ 
    element2.html(templateUrl, controller); 
}); 

アンギュラ1.5.8

Answer 1

あなたは、コントローラとテンプレートとのディレクティブを作成し、それをコンパイルし、DOMに追加するよりも可能性があります。

Answer 2

私はあなたがやりたがっていることは、動的にHTMLをレンダリングすることであると感じています。これには二つの解決方法があります。

1. 角度ルーティングを：あなたはあなたのアプリケーション内の別のページに移動したい場合、これは、主に使用されていますが、アプリケーションはSPA（シングルページアプリケーション）になりたいですページを再読み込みすることなく、ngRouteモジュールを使用することができます。これのコンテンツはどこでも入手可能です。あなたはそれらを見ることができます。

2. カスタムディレクティブ：あなたが欲しい方イベントのHTMLレンダリングうディレクティブ書いてみることができます。

   .directive("customTemplateLoad", function($http, $templateCache, $compile) { 
   return { 
       restrict: 'A', 
       link: function(scope, element, attr, controller){ 
       var template; 
       // Some logic to get template, perhaps pass it in the directive itself 
       var templatePath = '/templates/'+template; 
       $http.get(templatePath, { cache: $templateCache }).success(function(response) { 
        var contents = element.html(response).contents(); 
        $compile(contents)(scope); 
       }); 
       } 
   };})