Частичный шаблон angularjs с определенной областью

Question

Я хотел бы включить частичный шаблон внутри моего основного шаблона, но имеющий конкретную область действия, когда я называю частичный шаблон.

Например, это мой основной шаблон (очень упрощена, фактический шаблон является более сложным, так нг-итерация не может быть использована здесь):

<h1>title, my item1 name is {{item1.name}}</h1> 
.... 
<div ng-view="myPartial.html" scope="item1"></div> 
.... 
<div ng-view="myPartial.html" scope="item2"></div> 
... 

И myPartial.html это что-то вроде

<input ng-model="name" />... 

данные:

{item1: {name:"test1"}, item2: {name: "test2"}} 

ожидаемый результат:

<1>title, my item1 name is test1</h1> 
.... 
<div><input value="test1" /></div> 
.... 
<div><input value="test2"></div> 
... 

Как бы вы это делали, используя angularjs?

Должен ли я создать конкретную директиву с myPartial.html в качестве шаблона? Thanks

Answer 1

В нг-представление может быть найдено только один раз на странице, я использовал ng-include и ng-init для инициализации сферы действия конкретного контроллера:

<div ng-include="'/myPartial.html'" ng-init="init(items.item1)" ng-controller="YourController"></div> 

контроллер:

this.app.controller("YourController", function YourController($scope) { 
    $scope.init = function(item){ 
     $scope.item = item; 
    } 
}); 

Answer 2

В случае если ваши товары в том же формате, чем вы хотите использовать ngInclude. Директива ngView используется для разных целей.

Контроллер:

$scope.items = {item1: {name:"test1"}, item2: {name: "test2"}}; 

Общий вид:

<div ng-repeat="item in items" ng-include="'myPartial.html'"></div> 

myPartial.html:

<h2>{{item.name}}</h2>... 

Answer 3

<div ng-view="myPartial.html" ng-controller="yourController"></div>

, а затем создать yourController в качестве углового со ntroller (или использовать существующий) и назначать данные для $scope.item1