L'événement ng-change ne se déclenche qu'une fois pour chaque bouton radio lorsqu'il est créé avec ng-repeat

J'ai créé un AngularJS directive avec des boutons radio pour contrôler l'environnement de ma page de requête et de l'ajouter à ma page. Je suis l'aide d'une liaison bidirectionnelle à la carte une portée locale variable appelée environment à une application variable avec le même nom. Il semble bien fonctionner quand je créer les boutons de la radio de manière explicite dans le modèle (dans mon code j'utilise templateUrl à la place, mais toujours le même problème).

<div>
    <label><input type="radio" name="env" ng-model="environment" ng-change="changeEnvironment(1)" value="1" />Testing</label>
    <label><input type="radio" name="env" ng-model="environment" ng-change="changeEnvironment(2)" value="2" />Production</label>
</div>

Je peux sélectionner chaque choix autant de fois que je veux, et la valeur des bulles tout le chemin jusqu'à l'application du champ d'application variable.

Je voulais changer de la création de la radio boutons à utiliser ng-repeat sur un tableau de choix des objets. Il crée les options, et il saisit la ngChange événement, mais seulement une fois pour chaque choix.

<label ng-repeat="choice in choices">
    <input type="radio" name="env" ng-model="environment" ng-change="changeEnvironment(choice)" value="{{ choice.id }}" />{{ choice.name }}
</label>

Ici est la version de travail de violon et les parties pertinentes de mon directive code:

template: '<div>'
            + '<label><input type="radio" name="env" ng-model="environment" ng-change="changeEnvironment(1)" value="1" />Testing</label>'
            + '<label><input type="radio" name="env" ng-model="environment" ng-change="changeEnvironment(2)" value="2" />Production</label>'
            + '<div>Directive environment: {{ environment }}</div>'
            + '</div>',
link: function(scope, element, attributes) {

    scope.changeEnvironment = function(choiceID) {
        console.log('SELECTED environment ' + choiceID);
        scope.environment = choiceID;
        console.log('directive environment = ' + scope.environment);
    };

}

Et voici la version qui ne fonctionne qu'une fois:

template: '<div><label ng-repeat="choice in choices">'
            + '<input type="radio" name="env" ng-model="environment" ng-change="changeEnvironment(choice)" value="{{ choice.id }}" />{{ choice.name }}'
            + '</label>'
            + '<div>Directive environment: {{ environment }}</div>'
            + '</div>',
link: function(scope, element, attributes) {
    scope.choices = [
        { id: 1, name: "Testing" },
        { id: 2, name: "Production" }
    ];

    scope.changeEnvironment = function(choice) {
        console.log('SELECTED environment ' + choice.id);
        scope.environment = choice.id;
        console.log('directive environment = ' + scope.environment);
    };

}

Je suis tout nouveau à AngularJS, il est donc tout à fait possible, je suis en train de faire une erreur très basique. Quelqu'un peut me pointer dans la bonne direction?

Mise à JOUR Comme par callmekatootie de la suggestion, j'ai changé l'événement en question de ng-change à ng-clicket il se déclenche à chaque fois. Que va faire pour contourner pour l'instant, mais j'ai d'abord utilisé ng-change parce que je ne pense pas que ng-click s'appliquerait aux changements causés par cliquant sur l'étiquette de texte plutôt que de l'entrée elle-même, mais en fait il ne. Ne comprends toujours pas pourquoi ng-change ne se déclenche une fois, même si.

source d'informationauteur Danny