如何在AngularJS的相同視圖和控制器中重用html模板？

Question

我有一個表單模板，如下所示。

<form editable-form name="tableForm"> 
    <table> 
     <tr style="font-weight: bold"> 

      // Column names here.... 

     </tr> 
     <tr ng-repeat="user in list1> 

      //Column values here ... 

     </tr> 
    </table> 
</form> 

我想重複使用此模板在同一頁面/控制器中使用不同的模型創建多個表格，例如， list1，list2，list3等

如何動態傳遞表單和模型的名稱，以便所有這些表的操作獨立於對方，並且仍然不需要重複使用具有不同表單名稱和列表模型的相同html我的view.html？

感謝

Answer 1

您可以將directive添加到您的角度應用。

首先，你有你的HTML移動到一個單獨的文件，然後聲明一個指令：

.directive('tableform', function() { 
    return { 
    scope: { 
     list: '=' 
    }, 
    restrict: 'E', 
    replace: true, 
    templateUrl: '<path to html file>' 
    }; 
}); 

，最後，你可以使用它像這樣：

<tableform list="list1" /> 
<tableform list="list2" /> 
...