Comment accéder à FormController dans le contrôleur ou la portée parent dans AngularJS

Il y a un moyen beaucoup plus simple pour communiquer dans le cadre de la hiérarchie en utilisant angulaire du processus de recherche d'objets dans son champ d'application de la hiérarchie.

Cela nous permet de fixer l'objet d'une moindre étendue dans une étendue supérieure à l'aide de la notation par points.

Dans ce cas, vous devez créer un "catcher" objet vide sur le dessus de la commande de niveau. Cette catcher objet peut ensuite être affectés à la forme des objets à partir de la plus faible étendues. Voici une débarquez pour la démo.

http://plnkr.co/edit/xwsu48bjM3LofAoaRDsN?p=preview

Il n'est pas parfaitement élégante, mais si vous pensez de cette "catcher" objet comme un écouteur d'événement, nous sommes toujours en suivant un modèle standard.

créer un vide de détecteur d'objet dans le contrôleur de l'endroit où vous souhaitez une référence à la imbriqué

function mainController($scope){
  $scope.catcher = {

  };
 }

Puis dans la balise elle-même chaque fois que le ng-forme de la directive est déclarée, le jeu catcher.nomformulaire = formName comme

<ng-form name="alpha">
          <span ng-init="catcher.alpha = alpha"></span>
          <input type="text" required="" ng-model="alphaValue" />
        </ng-form>

Parce que nous sommes attribuées à la "catcher.", angulaire de la traversée de la portée de la hiérarchie et de trouver thd dans le mainController peu importe le nombre de contrôleurs entre les deux (en supposant qu'ils n'ont pas de détecteur d'objet, bien sûr)

Dans le angulaire de la documentation on peut lire:

<form
       [name="{string}"]>
</form>

Nom de la forme. Si ce paramètre est spécifié, le formulaire de commande sera publié
dans une portée, c'est sous ce nom.

Cependant, il ya certaines directives, comme ngIfque de créer un nouveau champ d'application:

Noter que lorsqu'un élément est supprimé à l'aide de ngIf son champ d'application est détruit
et un nouveau champ d'application est créée lors de la restauration de l'élément.

Peut-être votre cas? Si oui, vous pouvez essayer de définir le nom du formulaire à quelque chose comme "des formes.section1Form", puis accédez-y par conséquent dans le champ d'application.

Pour obtenir le réelle FormController responsable d'une certaine directive, il vous suffit de require la form avec le chapeau de préfixe. Cela permet de stocker une référence dans vos directives fonction de lien:

module.directive('awesomeFormChild', [function () {

    var formController;

    return {
        require: '^form',
        link: function(scope, elm, attr, ctrl) {
            formController = ctrl;
        }
    };

}])

Concernant Sunil D., le roman de la solution pour fournir la forme du champ d'application de parent étendues (voir https://stackoverflow.com/a/22487840/1518575), vous pouvez réellement obtenir la forme du champ d'application de l'objet événement qui est envoyé dans un $émettre l'appel.

Depuis au moins Angulaire 1.0.3, l'objet de l'événement a un targetScope de la propriété, qui fait référence à la portée de l'événement était de $émettent-ed. (Voir http://docs.angularjs.org/api/ng/type/$rootScope.Champ#$pour plus d'informations sur les propriétés de l'objet d'événement.)

Avec cela à l'esprit, vous pouvez simplifier Sunil D. directive du code:

module.directive('formLocator', function() {
  return {
    link: function(scope) {
      scope.$emit('formLocator');
    }
  };
});

Le modèle ne change pas du tout:

<form name="myForm" novalidate="" form-locator>

Et par la suite vous pouvez modifier le code de gestion des événements:

$scope.$on('formLocator', function(event) {
  $scope.myDeeplyNestedForm = event.targetScope.myForm;
});

Cette directive serait pertinente dans tous les scénarios où vous voudriez offrir une gamme pour l'un de ses ancêtres, et pas seulement dans le cas de ngForm. Dans mon code, j'ai renommé la présente directive au plus génériques "présent", puisqu'une façon de penser de l'objectif de la directive est qu'il annonce la présence d'un champ.

Similaire à Sunil D. solution, j'ai trouvé un similaire, mais implicitement réglage de la portée de la variable, la formController dans lequel la balise a été utilisé, comme je ne veux pas coder en dur le nom de la forme à deux reprises:

renderFormModule.directive('formLocator', function() {
    return {
        link: function(scope, element) {
            scope.formAssociated = scope[element[0].name];
        }
    }
});

Et puis, la vue de quelque chose comme:

    <form name="testForm" ng-controller='formController as formCtrl' form-locator novalidate>