Boutons radio ng-checked avec ng-model

Dans ma page HTML, j'ai deux jeux de Booléen basé sur des boutons radio: Marqué: "Oui" et "Non" /Valeurs: Vrai et Faux respectivement. Je suis le remplissage d'un formulaire complet à partir d'une base de données PostgreSQL de table pour permettre à l'utilisateur authentifié pour afficher le formulaire avec les données préétablies et de modifier l'renseigné les champs, y compris les boutons de la radio, puis enregistrez le formulaire qui permettra de sauver les données de la DB. Tous les autres champs de texte à remplir sans problème; c'est à la fois la collection de boutons radio, je vais avoir un problème de pré-cocher les boutons de la radio.

Ci-dessous ne fait pas de pré-remplir les bagages sur le devant de la fin (mais ajoute le bon attribut de vérifié dans la source HTML):

    <input id="billing-no" type="radio" name="billing" ng-model="person.billing" value="FALSE" ng-checked="person.billing == 'false'" />
    <input id="billing-yes" type="radio" name="billing" ng-model="person.billing" value="TRUE" ng-checked="person.billing == 'true'" />

Toutefois, cela ne veut vérifier le bon bouton radio sur la charge:

    <input id="billing-no" type="radio" name="billing" value="FALSE" ng-checked="person.billing == 'false'" />
    <input id="billing-yes" type="radio" name="billing" value="TRUE" ng-checked="person.billing == 'true'" />

Remarque: j'avais besoin de vérifier à l'encontre de la chaîne de valeur booléenne dans la directive ng-vérifié depuis la valeur booléenne en revient toujours comme une chaîne de caractères à partir de PostgreSQL. Celui-ci, apparemment, était une partie de PostgreSQL du design lors de l'interrogation des données des colonnes qui ont les types de données booléennes.

Lors de l'ajout de la ng-modèle de la directive, le bouton radio n'est plus vérifiée (au moins dans le rendu de la vue navigateur). L'étrange, c'est que j'ai regardé la source et vérifie la bonne. Ce qui est encore plus étrange, c'est que je dois cliquer sur le bouton radio deux fois pour "vérifier". J'ai testé cette dernière version de Chrome, FF et IE, et il tous les résultats dans le même numéro.

La question est: lors de l'ajout de la ng-modèle de la directive, pourquoi le source HTML ajouter "vérifié" dans le bouton radio attribut, mais apparemment ne marque pas le bouton radio? En outre, pourquoi je dois cliquer deux fois sur le bouton radio qui EST censé être vérifié?

Solution:
Pour résoudre ce problème, j'ai enlevé le ng-vérifié directive, les boutons de la radio et seulement utilisé ng-model comme suggéré par @Cypher et @aet. J'ai remplacé l'attribut valeur avec la directive ng-de la valeur "true" & "false". Après, j'ai mis les valeurs dans le contrôleur.

HTML

<input id="billing-no" type="radio" name="billing" ng-model="person.billing" ng-value="false" />
<input id="billing-yes" type="radio" name="billing" ng-model="person.billing" ng-value="true" />

Angular JS

app.controller('peopleCtrl', function($scope, peopleFactory){
    ...
    peopleFactory.getPerson(personParams).then(function(data){
        $scope.person = data;
        /* moved from ng-checked */
        $scope.person.billing = data.billing == 'true';
    });
    ...
};

source d'informationauteur RNickMcCandless

Je pense que vous ne devez utiliser ng-modèle et devrait bien fonctionner pour vous, voici le lien vers la documentation officielle de l'angulaire https://docs.angularjs.org/api/ng/input/input%5Bradio%5D

Le code de l'exemple ne doit pas être difficile à adapter à votre situation spécifique:

<script>
   function Ctrl($scope) {
      $scope.color = 'blue';
      $scope.specialValue = {
         "id": "12345",
         "value": "green"
      };
   }
</script>
<form name="myForm" ng-controller="Ctrl">
   <input type="radio" ng-model="color" value="red">  Red <br/>
   <input type="radio" ng-model="color" ng-value="specialValue"> Green <br/>
   <input type="radio" ng-model="color" value="blue"> Blue <br/>
   <tt>color = {{color | json}}</tt><br/>
</form>

J'ai résolu mon problème en utilisant simplement ng-init pour la sélection par défaut au lieu de ng-checked

<div ng-init="person.billing=FALSE"></div>
<input id="billing-no" type="radio" name="billing" ng-model="person.billing" ng-value="FALSE" />
<input id="billing-yes" type="radio" name="billing" ng-model="person.billing" ng-value="TRUE" />

1

Veuillez expliquer pourquoi même ng-model est-il utilisé? Et quelle est la valeur qui est passé à travers ng- model et comment c'est passé? Pour être plus précis, si j'utilise console.log(color) quel serait le résultat?

Vous devez vous connecter pour publier un commentaire.