же контроллер, две различные модели

Question

Это выглядит как простая проблема, но я не могу понять, лучший способ приблизиться к нему:

Большая картина: Я хочу иметь многоразовый шаблон адреса и включить его (используя grunt- включает) внутри других шаблонов, когда необходим адресный блок. Чтобы шаблон адреса был автономным и многоразовым, я подключил к нему контроллер адреса, а его внутренняя модель называется addressModel.

Проблема: у меня есть единственная страница, которая включает в себя многократно используемый AngularJS адрес template TWICE: один адрес будет использоваться для выставления счетов, а другой для доставки.

Вопрос: как настроить каждый блок для обработки своей соответствующей модели в области родительского контроллера? Другими словами, из родительского контроллера я хочу сказать, что модель для первого адресного блока равна $scope.billingAddress, а модель для второго связана с $scope.shippingAddress, зная, что внутри каждого контроллера адреса у меня есть доступ только к их локальному $scope.addressModel и Я не знаю ни одного из дочерних контроллеров, для которого addressModel предназначался для текущего контроллера.

Answer 1

Для этой цели вы должны использовать директиву с изолированной областью. Пример:

angular.module('some-module', []).directive('address', function() { 
    return { 
     restrict: 'EA', 
     scope: { 
      address: '=data' 
     }, 
     template: '<ul><li>{{ address.city }}</li><li>{{ address.street }}</li></ul>' //or you can use 'templateUrl' 
    }; 
}); 

Простое использование: Вставка в шаблон: <address data="billing.address"></address>

Расширенный пример вы можете увидеть здесь: jsbin

Подробнее о директивах: https://docs.angularjs.org/guide/directive

Надеюсь, это поможет вам ,