AngularJS - à l'aide d'un formulaire et de l'auto-complétion

J'ai le code suivant dans une page partielle utilisé pour la connexion...

<div class="container">
    <form autocomplete="on" data-ng-submit="checkCredentials()" class="form-signin">
        <h2 class="form-signin-heading">Login page</h2>
        <label for="email"> <b>User e-mail</b> </label>
        <input required autocomplete="on" name="email" type="text" data-ng-model="modelLogin.email" class="input-block-level" placeholder="Email address">
        <label for="pass"> <b>Password</b> </label>
        <input required autocomplete="on" name="pass" type="password" data-ng-model="modelLogin.password" class="input-block-level" placeholder="Password">
        <button style="margin-bottom:1em" class="btn btn-large btn-primary" type="submit">Log in</button>
    </form>
</div>

...qui est ng-inclus à partir de ma seule et unique page principale (index.html):

<body data-ng-controller="controllerLogin">
    <div data-ng-include="getMainpageBasedOnLoginStatus()">
    </div>
</body>

...avec le getMainpageBasedOnLoginStatus() fonction retournant le chemin d'accès approprié pour le partials/loginPage.html indiquée ci-dessus ou le partials/mainApplicationPage.html (mon application principale point d'entrée). Le checkCredentials() appel fait par ng-soumettre effectue un webservice appel à revenir connexion de succès ou d'échec, et de la bonne mise à jour dans un modèle global variable, de sorte que les appels suivants à getMainpageBasedOnLoginStatus() return 'ok vous êtes connecté en page (partials/mainApplicationPage.html).

Cette connexion ne peuvent pas être piraté, parce que même si le code client est en quelque sorte changé le diriger vers le application principale partielle au lieu de la connexion partielle, du côté serveur, et ne sera tout simplement pas fonctionner correctement (demandes de service web n'est tout simplement pas la fonction et retourner 406 erreurs).

Tout est bien cela fonctionne. Sauf pour les... le remplissage automatique.

Le login/mot de passe champs ne sont ni complété automatiquement, ni remplis automatiquement avec google Chrome 29. Même dans Firefox 23: le login/mot de passe champs ne sont pas remplis automatiquement, mais la connexion d'un (seul le login, pas le mot de passe!) est complété automatiquement - mais pas auto-rempli.

Noter que j'ai utilisé le HTML5, l'attribut de saisie semi-automatique " à la fois dans la forme et les deux entrées - avec pas de raison que ce soit.

Googler a révélé d'autres personnes qui font face à des questions connexes ( Mémoriser le Mot de passe avec AngularJS et ng-soumettre ) , avec pas de réponse... je ne pouvais pas upvote cette question (je suis trop vert encore, DONC-sage).

Il y a aussi un billet ouvert sur AngularJS ( https://github.com/angular/angular.js/issues/1460 ) qui est là depuis 7 mois, et raconte le plutôt triste histoire d'un peuple où la saisie automatique était en fait "travailler", le navigateur sage, pour certaines personnes, sauf que le modèle sous-jacent n'a pas été mis à jour... et un commentaire de quelqu'un appelé "bigbag" que la fonctionnalité est maintenant désactivé, pour cette raison.

Je trouve cela plutôt inacceptable du point de vue de AngularJS - certes, je ne suis pas le premier qui a besoin de remplissage automatique/saisie semi-automatique dans son application, ses formes, suis-je? Ou dois-je abandonner l'Unique Page de la théorie et de revenir à la méchante forme action et séparée de serveur-côté login.html/main.html les réponses à obtenir la saisie automatique/saisie semi-automatique de travail?

Toute aide/conseils les plus appréciés et ont désespérément besoin...

Incroyable: 2h après cette annonce, Firefox 24 sortis, où le remplissage automatique fonctionne! Suppose que je dois attendre pour Chrome pour résoudre ce problème, trop...
Peut-être vous pouvez consulter cette article sur le problème: timothée.userapp.io/post/63412334209/...

OriginalL'auteur angularJsNewbie | 2013-09-17

  1. 5

    Ici est une solution alternative qui est sémantiquement son AngularJS: http://victorblog.com/2014/01/12/fixing-autocomplete-autofill-on-angularjs-form-submit/

    myApp.directive('formAutofillFix', function() {
  return function(scope, elem, attrs) {
    //Fixes Chrome bug: https://groups.google.com/forum/#!topic/angular/6NlucSskQjY
    elem.prop('method', 'POST');

    //Fix autofill issues where Angular doesn't know about autofilled inputs
    if(attrs.ngSubmit) {
      setTimeout(function() {
        elem.unbind('submit').submit(function(e) {
          e.preventDefault();
          elem.find('input, textarea, select').trigger('input').trigger('change').trigger('keydown');
          scope.$apply(attrs.ngSubmit);
        });
      }, 0);
    }
  };
});

    Ensuite, vous fixez la directive à votre formulaire:

    <form ng-submit="submitLoginForm()" form-autofill-fix>
  <div>
    <input type="email" ng-model="email" ng-required />
    <input type="password" ng-model="password" ng-required />
    <button type="submit">Log In</button>
  </div>
</form>
    Je viens de pleinement mise en œuvre de la présente directive et il ne fonctionne pas. Est-ce toujours d'actualité?
    Peut-être pas, beaucoup de choses ont changé dans Angulaire de base, même sur la "petite" version bosses, esp. à l'égard de laquelle eventbindings, etc. J'aurais aimé avoir documenté la version Angulaire ceci a été écrit pour la raison qui vont presque certainement être un facteur pour cette correction.

    OriginalL'auteur Ezekiel Victor

  2. 2

    Une bonne chose à propos de la saisie semi-automatique est qu'il laisse la forme $vierges.

    Vous pouvez faire une vérification simple et obtenir la valeur en cas de besoin:

    if($scope.[form_name].$pristine){
   var input document.getElementById([input_id]);
   var input_value = input.value
}

    Vous pouvez ensuite soumettre la valeur ou la remplacer.e.g $scope.[module] = input.value

    OriginalL'auteur raam86