Mettre à jour la variable de portée parent

Question

J'ai deux contrôleurs, l'un enveloppé dans un autre. Maintenant, je sais que la portée enfant hérite des propriétés de la portée parent, mais existe-t-il un moyen de mettre à jour la variable de portée parent? Jusqu'à présent, je n'ai trouvé aucune solution évidente.

Dans ma situation, j'ai un contrôleur de calendrier dans un formulaire. Je souhaite mettre à jour les dates de début et de fin à partir de la portée parente (qui est le formulaire) afin que le formulaire ait les dates de début et de fin lors de la soumission.

Answer 1

Vous avez besoin d'utiliser un objet (non primitive) dans la portée parent et vous serez alors en mesure de mettre à jour directement à partir de l'enfant

app.controller('ctrlParent',function($scope){
    $scope.parentprimitive = "someprimitive"
    $scope.parentobj = {};
    $scope.parentobj.parentproperty = "somevalue";
});
app.controller('ctrlChild',function($scope){
    $scope.parentprimitive = "this will NOT modify the parent"
    $scope.parentobj.parentproperty = "this WILL modify the parent";
});

Travail de démonstration: http://jsfiddle.net/sh0ber/xxNxj/

Voir Quelles sont les nuances de portée prototypes / l'héritage par prototype dans AngularJS?

Answer 2

Il existe un autre moyen d'effectuer cette tâche et de ne pas utiliser la variable $scope.$parent .

Préparez simplement une méthode pour changer la valeur dans la portée parent et utilisez-la dans l’enfant 1. Comme ça:

 app.controller('ctrlParent',function($scope) {
  $scope.simpleValue = 'x';
  $scope.changeSimpleValue = function(newVal) {
    $scope.simpleValue = newVal;
  };
});

app.controller('ctrlChild',function($scope){
    $scope.changeSimpleValue('y');
});
 

Cela fonctionne également et vous donne plus de contrôle sur les changements de valeur.

Vous pouvez alors également appeler la méthode même en HTML, comme par exemple: <a ng-click="changeSimpleValue('y')" href="#">click me!</a> .

Answer 3

Cela fonctionne aussi (mais pas sûr si cela suit les meilleures pratiques ou non)

 app.controller('ctrlParent',function($scope) {
    $scope.simpleValue = 'x';
});

app.controller('ctrlChild',function($scope){
    $scope.$parent.simpleValue = 'y';
});
 

Answer 4

Lorsque vous affectez une primitive de l'attribut étendue, il est toujours locale de la portée (peut-être créé à la volée), même si un parent a un attribut du même nom. C'est une décision de conception, et un bon à mon humble avis.

Si vous avez besoin de changer certaines primitives (entiers, booléens, chaînes de caractères) dans le parent de la portée, de la vue, vous avez besoin d'un attribut d'un autre objet dans l'étendue, la cession peut lire:

<a ng-click="viewData.myAttr = 4">Click me!</a>

et il va, à son tour:

1. obtenez de l' viewData objet, de quelque étendue qu'elle est définie dans
2. attribuer 4 de ses myAttr d'attribut.