emit - angularjs rootscope apply




AngularJS acessa o escopo pai do controlador filho (6)

Eu configurei meus controladores usando data-ng-controller="xyzController as vm"

Eu tenho um cenário com controladores aninhados pai / filho. Não tenho nenhum problema em acessar as propriedades pai no html aninhado usando $parent.vm.property , mas não consigo descobrir como acessar a propriedade pai de dentro do meu controlador filho.

Eu tentei injetar $ scope e, em seguida, usando $scope.$parent.vm.property , mas isso não está funcionando?

Alguém pode oferecer conselhos?


A partir de um componente filho, você pode acessar as propriedades e métodos do componente pai com 'require'. Aqui está um exemplo:

Pai:

.component('myParent', mymodule.MyParentComponent)
...
controllerAs: 'vm',
...
var vm = this;
vm.parentProperty = 'hello from parent';

Criança:

require: {
    myParentCtrl: '^myParent'
},
controllerAs: 'vm',
...
var vm = this;
vm.myParentCtrl.parentProperty = 'hello from child';

Acabei de verificar

$scope.$parent.someProperty

funciona para mim.

e será

{{$parent.someProperty}}

para a vista.


Eu acredito que eu tive um dilema semelhante recentemente

function parentCtrl() {
   var pc = this; // pc stands for parent control
   pc.foobar = 'SomeVal';
}

function childCtrl($scope) {

   // now how do I get the parent control 'foobar' variable?
   // I used $scope.$parent

   var parentFoobarVariableValue = $scope.$parent.pc.foobar;

   // that did it
}

Minha configuração foi um pouco diferente, mas a mesma coisa provavelmente ainda funcionaria


Quando você estiver usando as sintaxe, como ParentController as parentCtrl , para definir um controlador, em seguida, para acessar a variável de escopo pai no uso do controlador filho, a seguir:

var id = $scope.parentCtrl.id;

Onde parentCtrl é o nome do controlador pai usando as sintaxe e id é uma variável definida no mesmo controlador.


Super fácil e funciona, mas não tenho certeza porque ....

angular.module('testing')
  .directive('details', function () {
        return {
              templateUrl: 'components/details.template.html',
              restrict: 'E',                 
              controller: function ($scope) {
                    $scope.details=$scope.details;  <=== can see the parent details doing this                     
              }
        };
  });

Talvez isso seja coxo, mas você também pode apontar para ambos em algum objeto externo:

var cities = [];

function ParentCtrl() {
    var vm = this;
    vm.cities = cities;
    vm.cities[0] = 'Oakland';
}

function ChildCtrl($scope) {
    var vm = this;
    vm.cities = cities;
}

O benefício aqui é que as edições em ChildCtrl agora se propagam de volta para os dados no pai.







angularjs-scope