Почему родительская область в директиве не изменяется

Question

Почему родительская область в директиве не изменяется

0

У меня есть две директивы. Когда я изменяю данные в родительской области из области дочернего объекта, данные не изменяются. Вы можете протестировать, щелкнув один из элементов li.

http://plnkr.co/edit/7ewMokT2vTnLWBFEdm14?p=preview

HTML

    <ez-select>
 <ez-option title="option 1">
        Option 1 inside
        <input ng-model="x">{{x}}
    </ez-option>
  <ez-option title="option 2">
        Option 2 inside
    </ez-option>
</ez-select>

JAVASCRIPT

m.directive('ezSelect',function(){
    return {
      template:'<ul ng-transclude></ul><br>Selected: {{selected}}',
      transclude:true,
      link:function($scope){
        $scope.selected=1
      }
    }
  });
    m.directive('ezOption',function(){
        return {
            template:'<li></li><div ng-show=selected ng-transclude class=body></div>',
            link:function ($scope,iElement,iAttrs,controller,tanscludeFn){
                iElement.find('li').html(iAttrs.title)
                iElement.closest('ez-select').find('.body')
                iElement.find('li').on('click',function(){
                  $scope.selected=false
                  $scope.$parent.selected=2
                })
            },
            controller:function($scope){
              $scope.selected=false
            },
            transclude:true
        }
    })

Aminadav Glickshtein 22 июль 2015, в 02:25

Источник

1

примечание: ВСЕГДА есть точка (или [] ) в ng-model . Вы используете примитивы, и они не имеют наследования, как объект, поэтому вы потеряете двустороннее связывание в дочерних областях. В противном случае это та же проблема, что и ваш последний вопрос
charlietfl 22 июль 2015, в 00:29

Теги:

javascript

angularjs

1 ответ

Ещё вопросы

примечание: ВСЕГДА есть точка (или [] ) в ng-model . Вы используете примитивы, и они не имеют наследования, как объект, поэтому вы потеряете двустороннее связывание в дочерних областях. В противном случае это та же проблема, что и ваш последний вопрос

Joy · Accepted Answer · 2015-07-21T23-10-00.000Z

Проверьте эту рабочую демонстрацию: http://plnkr.co/edit/lRKhAHB9zmHKKrcdD6nO?p=preview.

Требуются две модификации.

Во-первых, как комментирует charlietfl, всегда используйте объект для совместного использования модели. Для подробного объяснения, проверьте эту замечательную статью: Понимание областей. В вашем примере я изменил selected чтобы быть selected data.selected.

Во-вторых, поскольку событие onClick выходит из цикла с угловым циклом, вам нужно использовать $scope.$apply для запуска цикла $digest вручную. Так:

$scope.$apply(function () {
    $scope.selected=false;
    $scope.$parent.data.selected=2;
});

Некоторые проблемы, связанные с вашим стилем кодирования:

В соглашении мы используем scope вместо $scope в функции связи
Вместо элемента element.on используйте ng-click