0

angularjs を使用して、次のコードでラジオ ボタン グループを繰り返します。

<div class="row observation-point"
         ng-repeat="observationPoint in question.observationPointList">
        <div class="col-md-6 col-sm-6">
            <small>{{observationPoint.text}}</small>
        </div>
        <div class="col-md-4 col-sm-4 col-md-offset-2 col-sm-offset-2">
            <label class="radio-inline">
                <input type="radio" ng-disabled="observation.status != 'Open'"
                       name="{{domain.id}}-{{question.id}}-{{observationPoint.id}}"
                       id="{{domain.id}}-{{question.id}}-{{observationPoint.id}}-1" ng-value="true"
                       ng-model="observationPoint.observed">{{'observation-domain.html.yes' | translate}} {{observationPoint.observed}}
            </label>
            <label class="radio-inline">
                <input type="radio" ng-disabled="observation.status != 'Open'"
                       name="{{domain.id}}-{{question.id}}-{{observationPoint.id}}"
                       id="{{domain.id}}-{{question.id}}-{{observationPoint.id}}-0" ng-value="false"
                       ng-model="observationPoint.observer">{{'observation-domain.html.no' | translate}}
            </label>


        </div>
    </div>

angular 1.2.28 では問題なく動作しましたが、最近 1.4.2 にアップグレードした結果、下の図のようになりました。

ここに画像の説明を入力

モデル値は変数に正しく保存および復元されますが (画像の true 値と false 値を参照)、ページをリロードした後、ng-repeat の最後のラジオ ボタンのみが選択されます。

なぜこれが起こっているのか、何が問題なのか、これを修正する方法が本当にわからないからです。

注意してください。observationPoint.observer には、文字列ではなくブール値が含まれています

編集:単純化されたプランカーを作成しましたが、もちろんこれは意図したとおりに機能します:S http://plnkr.co/edit/tWjizHB8I5FNZVOgdq6J?p=preview

これは、名前または ID に何か問題があることを示唆しています。ただし、開発者ツールのIDと名前を確認すると問題ないようです ここに画像の説明を入力

4

1 に答える 1

3

動的な名前をから変更すると、解決策が見つかりました

name="{{domain.id}}-{{question.id}}-{{observationPoint.id}}"

に

name="observationPoint_{{observationPoint.id}}"

問題なく動作します。なんらかのロード/タイミングの問題が発生していると思います。変数は、UI がレンダリングされる時点ではおそらく一意ではなく、最後の項目のみが設定されます。

于 2015-09-16T06:44:55.353 に答える