angularJS:如何恢复/阻止单选按钮事件？

Question

我在http://jsfiddle.net/S2kc7/1/中有一个(非工作)示例

<radio ng-model="value" ng-value="foo">
<radio ng-model="value" ng-value="bar">

如果用户不批准,我想恢复到以前的状态.

例如,如果在用户点击"bar"之前ng-model ="value"在"foo"上,然后用户选择取消,我想阻止该事件,并保持"value = foo",没有任何改变或观看.

我试过了:

$scope.$watch('value', function(){ newvalue = oldvalue })
$scope.clicked = function($event) { $event.preventDefault(); }
<radio ng-change="check_and_prevent()">

这些方法都没有能够取消事件(在我的测试中).一些测试的遗骸在上面的jsfiddle中被注释掉了.

我可以阻止<radio>上的活动吗？

我可以阻止<select>上的事件吗？

编辑 @jose的答案适用于所提出的案例,但不适用于真实的网站;

在我的网站中,"价值"实际上是一个对象的属性; 但即使是在jsFiddle的无菌环境中也能解决这个问题:http: //jsfiddle.net/L5555/

但不是在我的网站上.

我不知道有什么区别,我无法透露我的网站.

不管怎么说,还是要谢谢你.

Answer 1

接受的答案不包括使ajax调用模型更改的场景.

您可以通过带有标签标签的周围无线电输入完全阻止更改.

<label ng-click="confirmChange($event)"><input type="radio" ng-model="value" value="foo" ></label>



$scope.confirmChange = function(event) {
   if(!confirm('sure?')) {
     event.preventDefault();
   } 
};

Answer 2

您可以使用ng-change使其工作。确保每个无线电都有ng-change

<input type="radio" ng-model="value" value="foo" ng-change="validateChange()">
<input type="radio" ng-model="value" value="bar" ng-change="validateChange()">
<input type="radio" ng-model="value" value="zaz" ng-change="validateChange()">

您可以在控制器中使用此逻辑

$scope.value= $scope.preval= 'foo';
$scope.validateChange = function() {
    if(confirm('revert???  value='+$scope.value+'  preval='+$scope.preval)) {
        $scope.preval = $scope.value;
    } else {
        $scope.value = $scope.preval;
    }
};

更新并工作的小提琴http://jsfiddle.net/S2kc7/3/