121

多くの ng-xxxx の種類のオプションを検索して試しましたが、見つかりませんでした..ラジオボタンが選択されたときにコントローラーで関数を呼び出したいだけです。

したがって、次のようになります..（もちろん、以下のコードは機能しません） 

<input type="radio" ng-model="value" value="one" ng-click="checkStuff()"/>

私が望むものを達成する方法はありますか？

4

7 に答える 7

235

ラジオ ボタンの選択で関数を呼び出すには、少なくとも 2 つの異なる方法があります。

1)ng-changeディレクティブの使用:

<input type="radio" ng-model="value" value="foo" ng-change='newValue(value)'>

そして、コントローラーで：

$scope.newValue = function(value) {
     console.log(value);
}

これが jsFiddle です: http://jsfiddle.net/ZPcSe/5/

2) モデルの変更を監視します。これには、入力レベルで特別なことは必要ありません。

<input type="radio" ng-model="value" value="foo">

しかし、コントローラーでは次のようになります。

$scope.$watch('value', function(value) {
       console.log(value);
 });

そしてjsFiddle: http://jsfiddle.net/vDTRp/2/

ユースケースについて詳しく知ることは、適切なソリューションを提案するのに役立ちます。

于 2012-10-25T21:38:13.703 に答える
19

トリガー ソースがクリックからでない場合は、ngClick の代わりに ngChange を使用する必要があります。

以下はあなたが望むものですか？あなたの場合、何がうまくいかないのですか？

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

function MyCtrl($scope) {
    $scope.value = "none" ;
    $scope.isChecked = false;
    $scope.checkStuff = function () {
        $scope.isChecked = !$scope.isChecked;
    }
}


<div ng-controller="MyCtrl">
    <input type="radio" ng-model="value" value="one" ng-change="checkStuff()" />
    <span> {{value}} isCheck:{{isChecked}} </span>
</div>
于 2012-10-25T21:28:40.553 に答える
6

動的な値の場合!

<div class="col-md-4" ng-repeat="(k, v) in tiposAcesso">
    <label class="control-label">
        <input type="radio" name="tipoAcesso" ng-model="userLogin.tipoAcesso" value="{{k}}" ng-change="changeTipoAcesso(k)" />              
        <span ng-bind="v"></span>
    </label>
</div>

コントローラーで

$scope.changeTipoAcesso = function(value) {
    console.log(value);
};
于 2016-06-12T15:08:12.503 に答える
2

もう 1 つの方法は、コントローラー スコープでゲッター セッター プロパティとしてObject.defineProperty設定valueすることです。その後、値プロパティを変更するたびに、セッターで指定された関数がトリガーされます。

HTML ファイル:

<input type="radio" ng-model="value" value="one"/>
<input type="radio" ng-model="value" value="two"/>
<input type="radio" ng-model="value" value="three"/>

JavaScript ファイル:

var _value = null;
Object.defineProperty($scope, 'value', {
  get: function () {
    return _value;
  },         
  set: function (value) {
    _value = value;
    someFunction();
  }
});

実装については、このプランカーを参照してください

于 2015-08-05T19:09:37.160 に答える
2

私は ng-value を ng-if と共に使用することを好みます。[ng-value] はトリガーの変更を処理します

<input type="radio"  name="isStudent" ng-model="isStudent" ng-value="true" />

//to show and hide input by removing it from the DOM, that's make me secure from malicious data

<input type="text" ng-if="isStudent"  name="textForStudent" ng-model="job">
于 2016-03-24T03:50:45.440 に答える