AngularJS: Как обновить сферу директивы от дочерних контроллеров

у меня есть простой контроллер родительский/дочерний набор следующим образом:AngularJS: Как обновить сферу директивы от дочерних контроллеров

<body ng-controller="ParentCtrl"> 

    <section my-directive></section> 

    <div ng-controller="Child1Ctrl"> 
     <button ng-click="child1()">Click Child1</button> 
    </div> 

    <br> 

    <div ng-controller="Child2Ctrl"> 
     <button ng-click="child2()">Click Child2</button> 
    </div> 

</body>

Когда я нажимаю на любой кнопке, от ребенка Ctrl ИЛИ Ребенок Ctrl, я хочу, чтобы области в моей директиве обновлялись.

myDirective.js

app.directive('myDirective', function() { 

    var slider = { 
     initial : function() { 
      slider.clear(); 
      $scope.slideHide = false; 
      $scope.slideShow = false; 
     }, 
     clear: function() { 
      $scope.slideMessage = ''; 
      $scope.slideError = false; 
      $scope.slideSuccess = false; 
     }, 
     error: function(message) { 
      $scope.slideShow = true; 
      $scope.slideError = true; 
      $scope.slideMessage = message; 
     }, 
     success: function(message) { 
      $scope.slideShow = true; 
      $scope.slideSuccess = true; 
      $scope.slideMessage = message; 
     } 
    } 

    return { 
     restrict: 'A', 
     replace: true, 
     transclude: true, 
     template: '<section class="slide">' + 
       '<div data-ng-class="{\'slide-show\' : slideShow, \'slide-error\' : slideError, \'slide-success\' : slideSuccess, \'slide-hide\' : slideHide}">' + 
        '<p>{{ slideMessage }}</p>' +       
       '</div>' + 
      '</section>' 
      } 
     } 
    );

И называют в моих детских контроллеров:

app.controller('Child1Ctrl', function($scope) { 
    $scope.child1 = function() { 

     $scope.$parent.slider.initialise(); 

    } 
}); 

app.controller('Child2Ctrl', function($scope) { 
    $scope.child2 = function() { 

     $scope.$parent.slider.success('Display some text'); 

    } 
});

Обновление с скрипкой:

http://jsfiddle.net/6uub3jqx/1/

Если вы нажмете на первый набор кнопок, появится красная/зеленая лента.

Если вы нажмете на кнопки с контроллерами child1/2, никаких действий не будет.

Решение:

См скрипка: http://jsfiddle.net/6uub3jqx/2/

По существу ребенок должен отправить:

$scope.successChild1 = function(msg) { 
    $scope.$emit('successCh1', 'Some data'); 
};

И родитель должен получить:

$scope.$on('successCh1', function (event, data) { 
    $scope.$broadcast('success', data); 
});

Будет ли корнеплод лучше альтернативой?

источник

2015-07-28 Oam Psy

@pixelbits - спасибо за информацию, можете ли вы привести пример? –

@pixelbits Что значит? «Разговор дешевый, дай мне код». – Vidul

@ CPH4 - в чем преимущество вашего комментария выше? –

Это зависит. Вы можете использовать угловую events или (ИМО лучше подход) услугу, которая сохраняет состояние, например:

.factory('myOwnScope', function() { 
    return {}; 
}); 

// include myOwnScope as dependency and share the information 
// between controllers and directive by its properties 
// (any Angular service is just a singleton)

источник

2015-07-28 09:10:20 Vidul

спасибо, но я изо всех сил пытаюсь понять, как это соответствует всему решению, которое я поделил выше. –

Пожалуйста, проверьте эти [ответы] (http://stackoverflow.com/questions/17470419/angularjs-shared-state-between-controllers). – Vidul

см. Обновленную скрипку. –

Есть несколько способов сделать это. Какой способ лучше всего зависит от того, что вы пытаетесь достичь.

Возможна инъекция данных в вашу директиву. Тогда вам не нужна переменная $ parent.

Это бы что-то подобное (но не можем гарантировать это работает, потому что вы не имеете plunker или что-то подобное)

В вашем HTML:

<section my-directive mytext="myobject.mymessage"></section>

В контроллере:

$scope.myobject = { mymessage: 'hi there' };

В вашей директиве:

return { 
    restrict: 'A', 
    scope: { mytext: '=' } 
    template: '{{mytext}}' 
}

источник

2015-07-28 10:30:46

Я добавил jsFiddle в мое обновление, см. Выше –

AngularJS: Как обновить сферу директивы от дочерних контроллеров

ответ

Смежные вопросы