web-dev-qa-db-fra.com

AngularJS: définir à nouveau le modèle = {} ne supprime pas l'entrée type = 'url'

J'ai une configuration de violoniste, quand je clique sur un bouton de réinitialisation, les commandes d'entrée doivent être effacées, cela semble fonctionner, mais pas lorsque l'entrée type='url'

Here is the fiddler

Y at-il un problème ou quelque chose que je ne comprends pas.

Quand je mis

$scope.myform = {};

Cela semble effacer l'autre type d'entrée, mais le type d'entrée = 'url' n'est pas effacé.

Quelqu'un sait pourquoi?

14
Martin

Le problème que vous voyez se produit lorsque vous n'avez pas de valeur valide dans l'entrée [type = "url"]. Une valeur non valide reste dans la vue ( le champ de saisie ) et n'est pas poussée vers la variable scope dans ng-model. La variable sera mise à jour uniquement si et si la valeur est correcte.

Vous pouvez le tester en entrant une valeur valide. Le bouton de réinitialisation fonctionnera. Si vous entrez une valeur invalide, ce ne sera pas le cas.

Vous pouvez résoudre ce problème en définissant $scope.myform = null au lieu de $scope.myform = {}. Cela videra le champ car la variable de portée ( expression ) sera undefined . Il sera automatiquement créé par Angular une fois que vous aurez entré une valeur valide dans l’un des champs.

19
avladov

Étant donné que vous devez placer une URL valide dans la deuxième zone, telle que http://www.abc.com, le bouton de réinitialisation fonctionnera.

1
zsong

Afin de mettre à jour correctement la vue/le modèle, je vous suggère de réinitialiser explicitement les propriétés du modèle de la manière suivante:

$scope.reset = function() {
    $scope.myform = {
        foo: '',
        bar: ''
    };
    $scope.formName.$setPristine();
};

Définir 'myform' sur un objet vide supprime ses champs, il ne les définit pas comme une chaîne vide. Il est fort probable que le nettoyage d'angular ne supprime pas nécessairement la valeur référencée par la vue, d'où la confusion entre le modèle de l'application et les états de la vue.

J'espère que ça a aidé.

1
Feussy