0

私は簡単なことをしようとしています: AngularJS を使用して、JSON オブジェクトのリストをフォームに配置します。そして、パラメーターの 1 つを HTML ラジオボタン コントロールにマップしたいと考えています。これは HTML テンプレートです:

<div ng-app="myApp" ng-controller='MainController'>
    <div ng-repeat="channel in channels">
        <p>Case {{ channel.schedule.timeOfDay }}</p>
        <input type="radio" ng-model="channel.schedule.timeOfDay" ng-value="0" name="channel">Case 0</input>
        <input type="radio" ng-model="channel.schedule.timeOfDay" ng-value="1" name="channel">Case 1</input>
        <input type="radio" ng-model="channel.schedule.timeOfDay" ng-value="2" name="channel">Case 2</input>
        <input type="radio" ng-model="channel.schedule.timeOfDay" ng-value="3" name="channel">Case 3</input>
        <hr>
    </div>
</div>

そして、単純なコントローラー:

var app = angular.module('myApp', []);
app.controller('MainController', function ($scope) {
    $scope.channels = [{
        "id": 4,
        "subject": null,
        "body": "Votre utilisation de données a atteint (SMS) [Percentage]%",
        "schedule": {
            "dayOfWeek": 24,
            "timeOfDay": 3,
            "from": 1,
            "to": 4
        },
        "channelType": 0
    }, {
        "id": 5,
        "subject": null,
        "body": "Votre utilisation de données a atteint (USSD) [Percentage]%",
        "schedule": {
            "dayOfWeek": 18,
            "timeOfDay": 1,
            "from": 0,
            "to": 0
        },
        "channelType": 1
    }, {
        "id": 6,
        "subject": "Avertissement",
        "body": "Votre utilisation de données a atteint (E-Mail) [Percentage]%",
        "schedule": {
            "dayOfWeek": 33,
            "timeOfDay": 3,
            "from": 15,
            "to": 22
        },
        "channelType": 2
    }]
});

この例のためにjsfiddleを作成しました/

ご覧のとおり、channel.schedule.timeOfDay をラジオボタン コントロールにマッピングすると、奇妙な動作が発生します。ラジオボタンは、1 番目と 2 番目の配列要素の値を反映しませんが、3 番目の配列要素は反映します。誰が何が起こっているのか説明してくれますか?

4

1 に答える 1