Puis-je accéder à un formulaire dans le contrôleur?

Question

Je suis actuellement en train d'utiliser ce qui suit.

$scope.$$childHead.customerForm[firstName], afin que :

Mais cela ne fonctionne que dans Chrome. Maintenant j'ai essayé ce qui suit :

$scope.editCustomerForm[firstName], afin que :

Ce qui ne fonctionne pas. Notez que mon formulaire est à l'intérieur d'un onglet Foundation. Comment puis-je accéder à firstName ?

MODIFICATION : Il semble que le form ne soit pas ajouté au scope lorsqu'il est à l'intérieur d'un onglet Foundation.

Quelqu'un a-t-il une solution pour cela ?

Answer 1

Cette réponse est un peu tardive, mais je suis tombé sur une solution qui rend tout beaucoup plus facile.

En fait, vous pouvez attribuer directement le nom du formulaire à votre contrôleur si vous utilisez la syntaxe controllerAs, puis le référencer à partir de votre variable "this". Voici comment je l'ai fait dans mon code :

J'ai configuré le contrôleur via ui-router (mais vous pouvez le faire comme vous le souhaitez, même directement dans le HTML avec quelque chose comme

). Voici à quoi cela pourrait ressembler dans une configuration ui-router :

views: {
            "": {
                templateUrl: "someTemplate.html",
                controller: "someController",
                controllerAs: "myCtrl"
            }
       }

Et ensuite dans le HTML, vous définissez simplement le nom du formulaire comme "controllerAs"."nom" ainsi :

Maintenant, à l'intérieur de votre contrôleur, vous pouvez simplement faire ceci :

angular
.module("quelquechose")
.controller("someController",
    [
       "$scope",
        function ($scope) {
            var vm = this;
            if(vm.someForm.$valid){
              // fais quelque chose
            }
    }]);

Answer 2

Oui, vous pouvez accéder à un formulaire dans le contrôleur (comme indiqué dans la documentation).

Sauf lorsque votre formulaire n'est pas défini dans la portée du contrôleur et est défini dans une portée enfant à la place.

Essentiellement, certaines directives angulaires, telles que ng-if, ng-repeat ou ng-include, créeront une portée enfant isolée. C'est également le cas pour les directives personnalisées avec une propriété scope: {} définie. Probablement, vos composants de base sont également sur votre chemin.

J'ai eu le même problème en introduisant un simple ng-if autour de la balise

.

Consultez ces liens pour plus d'informations:

• https://groups.google.com/forum/#!topic/angular/B2uB8-9_Xbk

• AngularJS - losing scope when using ng-include

Note: Je vous suggère de reformuler votre question. La réponse à votre question est oui mais votre problème est légèrement différent:

Puis-je accéder à un formulaire dans une portée enfant à partir du contrôleur?

À laquelle la réponse serait simplement: non.

Answer 3

Ajoutez l'attribut ng-model="$ctrl.formName" à votre formulaire, et ensuite dans le contrôleur vous pouvez accéder au formulaire en tant qu'objet à l'intérieur de votre contrôleur en utilisant this.formName

Answer 4

En réalité, vous ne pouvez pas accéder au formulaire dans la portée car il n'est pas créé. Le DOM du modèle HTML se charge un peu lentement, comme le constructeur du contrôleur. La solution est d'attendre que le DOM soit chargé et que toute la portée soit définie !

dans le contrôleur :

$timeout(function(){
    console.log('customerForm:', $scope.customerForm);
    // tout le reste dont vous avez besoin
});