2017-02-05 7 views
0

ng-checked="$first"を使用してラジオボタンのデフォルト選択を設定すると、チェックされます。 ng-checked="true"ラジオボタンを使用してもチェックされませんか?AngularJSでradio button checked = trueを設定する方法の相違点

これはいつ発生するのですか?あなたは、彼らがチェックを外すことカント確認したら

私はラジオボタンについて注意することは、私のユースケースに

+0

コードを表示してください。あなたは今何を試しましたか? – lin

+0

'ng-checked =" true "でうまく動作します。 http://jsfiddle.net/y8ecnu4p/を参照してください。 – lin

答えて

0

一つのことを$first ACCを使用傾けます。別のオプションを指定する必要があります。私はあなたのためにいくつかのサンプルを用意しました。

第1の方法では、コントローラーで値をtrueに設定して値を1に設定しても、チェックされています。これが最適なソリューションです。

ng-checkedイベントを使用する2番目の方法は値を変更しますが、ng-model値は更新されません。だからあなたはng-change関数を使用して、このメソッドのような誰もがng-model.personally誰も追跡しなくてはなりません。あなたのケースでは

var app = angular.module('myApp', []); 
 

 
app.controller('MainCtrl', function ($scope) { 
 
    $scope.myradio = true; 
 
    $scope.myradio_ng1 = true; 
 
    $scope.myradio_ng2 = false; 
 
    
 
    $scope.first = true; // probably you are getting this from db 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 
<head> 
 
<title>Radio</title> 
 
</head> 
 
<body ng-controller="MainCtrl"> 
 
    <p>1. Using ng-model</p> 
 
    <div> 
 
    <label for="myradio1">Yes</label> 
 
    <input type="radio" ng-model="myradio" name="myradio" id="myradio1" value="1" /> 
 
    <label for="myradio2">No</label> 
 
    <input type="radio" ng-model="myradio" name="myradio" id="myradio2" value="0"/> 
 
    </div> 
 
    <div>Radio value: {{myradio}}</div> 
 
    <p>2. Using ng-checked</p> 
 
    <div> 
 
    <label for="myradio3">First</label> 
 
    <input type="radio" name="myradiong" id="myradio3" ng-checked="myradio_ng1" /> 
 
    <label for="myradio4">Second</label> 
 
    <input type="radio" name="myradiong" id="myradio4" ng-checked="myradio_ng2"/> 
 
    <div>Radio value for first: {{myradio_ng1}}</div> 
 
    <div>Radio value for Second: {{myradio_ng2}}</div> 
 
    </div> 
 
    
 
    <p>Your case</p> 
 
    <label for="first">First</label> 
 
    <input type="radio" id="first" ng-checked="first" /> 
 
</body> 
 
</html>

あなたはそれが真であるときにチェックしたい要素を持っています。あなたのコントローラで$scope.firstの値をtrueまたはfalseに設定してから、ビューでng-checked="first"を使用してください。コードスニペットを実行して結果を探します。

関連する問題