ラジオボタンはUIで選択できません

Question

ラジオボタンを選択しようとしていますが、何とかUI側に表示されません。私は、クリックで関数を呼び出すとボタンを押すことができますが、UIは選択を表示しないことを確認しました。

<div data-ng-repeat="flagInfo in availableList"> 
    <input type="radio" name="flag" id="{{flagInfo.flagName}}" value="{{flagInfo.flagName}}" data-ng-click="selection(flagInfo.flagName)" /> 
    <span class="checkbox-label"> 
     <label for="{{flagInfo.flagName}}">{{flagInfo.translation}}</label> 
    </span> 
</div> 

誰かに解決方法を教えてもらえますか？

Answer 1

あなた用のスニペットを作成しました。あなたのコードの中にNGモデルがありません。あなたの入力タイプのラジオへ

function myCtrl($scope) { 
 
$scope.radioList={ 
 
'flagName':'abc' 
 
} 
 
    $scope.availableList = [{ 
 
     'flagName':'abc', 
 
     'id':1 
 
    },{ 
 
     'flagName':'def', 
 
     'id':2 
 
    },{ 
 
     'flagName':'ghi', 
 
     'id':3 
 
    },{ 
 
     'flagName':'jkl', 
 
     'id':4 
 
    }]; 
 
    $scope.radioChange=function(radval){ 
 
    console.log(radval); 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app ng-controller="myCtrl"> 
 
    <div data-ng-repeat="flagInfo in availableList"> 
 
    <input type="radio" name="flag" id="{{flagInfo.flagName}}" value="{{flagInfo.flagName}}" ng-model="radioList.flagName" ng-change="radioChange(radioList.flagName)" /> 
 
    <span class="checkbox-label"> 
 
     <label for="{{flagInfo.flagName}}">{{flagInfo.flagName}}</label> 
 
    </span> 
 
    </div> 
 
    <div> 
 
    Selected Radio : {{radioList.flagName}} 
 
    </div> 
 
</div>