angularJS：如何恢复/ prevent单选按钮事件？ [英] angularJS: how to revert / prevent radio button event?

问题描述

我在 http://jsfiddle.net/S2kc7/1/ <（非工作）的例子/ A>

i have a (non-working) example in http://jsfiddle.net/S2kc7/1/

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

如果用户不同意，我想恢复到previous状态。

if a user does NOT approve, i'd like to revert to the previous state.

例如，如果异常模型=值是在富用户点击栏前，然后用户选择取消，我想prevent该事件，并保持值= foo的，没有得到任何改变或$观看。

e.g., if ng-model="value" was on "foo" before the user clicked on "bar", and then the user chose to cancel, i'd like to prevent that event, and remain on "value=foo", without anything getting changed or $watched.

我试过：

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

这些方法能够取消事件（在我humle测试）。一些测试的遗体在上面的jsfiddle注释掉。

none of these methods were able to cancel the event (in my humle tests). some of the remains of the tests are commented out in the jsfiddle above.

我可以针对＆lt prevent事件;广播GT;

can i prevent event on <radio>?

我可以针对＆lt prevent事件;选择＆GT; ？

can i prevent event on <select> ?

修改
@圣何塞的回答工作的情况下presented，但不是在真实网站;

EDIT @jose's answer worked for the case presented, but not in the real website;

在我的网站上，价值实际上是一个对象的属性;但即使在的jsfiddle的无菌环境中工作了： http://jsfiddle.net/L5555/

In my website, "value" is actually a property of an object; but even that works out in jsFiddle's sterile environment: http://jsfiddle.net/L5555/

但不是在我的网站。

我不知道有什么区别，我不能透露我的网站。

I can't tell what's the difference, and i can't reveal my website.

要谢谢你。

推荐答案

您可以把它用NG-变革而努力。确保每个电台都有它的NG-变化

You can make it work by using ng-change. Make sure that each radio has the ng-change on it

<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()">

你可以在你的控制器使用这个逻辑

And you can use this logic in your controller

$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/

这篇关于angularJS：如何恢复/ prevent单选按钮事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！