Угловой 1.5. Как сделать включенный шаблон для привязки к области действия компонента

Question

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

<form-editor entity="vm.entity">
        <input ng-model="vm.dirtyEntity.name" required name="nameInput">
</form-editor>

Проблема в том, что ng-модель создает поле dirtyEntity в родительском vm, а не модифицирует одно из компонентов. Определение компонентов контроллера как "formVm" не помогло.

Есть ли способ заставить зашитый элемент ng-model изменить только область видимости компонента?

Или считается некорректным взаимодействие между включенным шаблоном и контроллером компонентов, и никогда не следует делать это?

Answer 1

Основываясь на plunkr dfsq, вот решение вашей проблемы:

В вашем компоненте вы программно копируете элементы, предназначенные для включения, и добавляете их в свой контроллер форм.

Вы можете программным образом включить использование $ transclude и добавить элементы в форму следующим образом:

$transclude($scope, function(clone) {
  $element.find('form').append(clone);
})

Затем вы добавляете элементы в свой контроллер формы следующим образом:

$scope.testForm.$addControl($element);

В этом случае вам нужно обернуть его в тайм-аут, в противном случае angular создаст экземпляр вашего контроллера и ваш код будет запущен, однако контроллер формы еще не создан.

Вот полный фрагмент, и вы можете найти plunkr здесь

controller($scope, $element, $transclude, $timeout) {
  // use a timeout to break javascript flow to allow a DOM update
  $timeout(function() {
    $transclude($scope, function(clone) {
      $element.find('form').append(clone);

      // take the form and add the elements to it
      $scope.testForm.$addControl($element);
    })
  })
}

Однако имейте в виду, что вам может потребоваться проверить элементы, которые не являются входными данными. Я не уверен, насколько надежный контроллер формы реагирует на изображение, добавленное в качестве элемента управления.