Case $vierges de l'état de ngModel sans l'aide d'un formulaire

Il y a deux façons:

1. Utilisation ng-form:

<span ng-form="myForm">
  <input type="text" name="name" ng-model="name" required/>
</span>

Vous pouvez maintenant accéder au modèle, soit à $scope.myForm.namedans votre contrôleur ou avec myForm.name de votre point de vue:

var isPristine = $scope.myForm.name.$pristine;

2. Utilisation angular.element().controller('ngModel') (Ne pas faire de celui-ci, bad bad)

Sinon, vous pouvez pirater votre chemin autour de lui. Mais cela va être moche, impossible à vérifier, et brut:

var elem = angular.element(document.getElementById('myElement'));
var model = elem.controller('ngModel');
var isPristine = model.$pristine;

---

Edit: Votre situation (par votre commentaire) à l'intérieur d'un répéteur

la seule différence entre mon exemple, et votre est que le champ de saisie est à l'intérieur d'une ng-répéteur. La pensée qui ne serait pas d'importance, mais je suppose qu'il n'.

Et maintenant il est temps de vous demander ce que vous faites et pourquoi... Vous pouvez toujours obtenir les informations dont vous avez besoin à l'aide de ng-form, mais vous aurez besoin de faire un truc de dingue que je ne recommande pas:

<div ng-repeater="item in items track by $index">
  <span ng-form="rptrForm">
    <input type="text" name="name" ng-model="item.name" required/>
  </span>
</div>

.. commencer folie:

//get the first child scope (from the repeater)
var child = $scope.$$childHead;
while(child) {
  var isPristine = child.rptrForm.$pristine;
  var item = child.item;
  if(!isPristine) {
    //do something with item
  }
  child = child.$$nextSibling;
}

Il est probablement temps de repenser votre stratégie

Je ne suis pas sûr de ce que votre objectif ultime est, mais vous voudrez peut-être repenser la façon dont vous allez à ce sujet et pourquoi. Pourquoi avez-vous besoin d'un accès par programme à $vierge, en votre contrôleur? Quelles sont les alternatives? Etc.

Moi, je voudrais essayer de mettre à profit une ng-change de l'événement et de mettre à jour certaines drapeau sur mon article dans mon répéteur, et de laisser le ng-forme de trucs pour la validation:

<div ng-repeat="item in items track by $index" ng-form="rptrForm">
   <input type="text" name="name" ng-model="item.name" ng-change="item.nameChanged = true" required/>
   <span ng-show="rptrForm.name.$error.required>Required</span>
</div>

OriginalL'auteur Ben Lesh

J'ai utilisé Ben Lesh, en réponse à traiter avec le même problème. J'ai été l'affichage d'une liste de préférences de notification, et mon objectif était de frapper mon api avec des modèles qui ont changé. Pas seulement ng-changé, soit; valeur a changé.

Je commence par l'initialisation de certains privée sur mon contrôleur:

//Private state
var originalModels = {};
var changedModels = [];

Puis-je conserver des copies de l'original modèles récupérés à partir de l'API:

//Create a hash of copies of our incoming data, keyed by the unique Code
for (var i = 0; i <= data.length - 1; i++) {
    var np = data[i];
    originalModels[np.Code] = angular.copy(np);
}

Prochaine, nous voulons faire en sorte que lorsque l'un des changements de modèle, nous ajoutons un a changé les modèles de la collection (ou la supprimer de la collection si pas de réel changement s'est produit):

function modelChanged(m) {
    var originalModel = originalModels[m.Code];
    var hasChanged = !angular.equals(originalModel, m);

    //If the model has changed and is not present in our collection of changed models, add it
    if (hasChanged && changedModels.indexOf(m) === -1) {
        changedModels.push(m);
    }

    //If the model has not changed and is present in our collection of changed models, remove it
    if (!hasChanged && changedModels.indexOf(m) > -1) {
        var i = changedModels.indexOf(m);
        changedModels.splice(i, 1);
    }
}

Enfin, nous lier ensemble dans notre ng-repeat:

<tr ng-repeat="np in npc.notificationPreferences">
    <td>{{np.DisplayName}}</td>
    <td>
        <input type="checkbox"
               ng-model="np.Sms"
               ng-checked="np.Sms"
               ng-disabled="!np.SmsEnabled"
               ng-change="npc.modelChanged(np)"/>
    </td>
</tr>

Maintenant, au lieu de repousser chaque ligne de mon API, j'ai simplement pousser le changement de modèles. Cela a également un autre avantage est de pouvoir ng-désactiver votre bouton soumettre si rien n'a réellement changé (c'est à dire le changedModels collection est vide).

OriginalL'auteur Adam Skinner