Angularjs - 如果在确认对话框为false时取消下拉列表中的更改事件?

时间:2017-07-12 07:31:19

标签: javascript angularjs dialog html-select

我正在使用Angularjs。我的问题是当我在下拉列表中选择一个新选项时,会出现一个对话框。如果对话框的结果为false,则所选的下拉选项必须相同。将分析从其他开发者那里获得想法。提前谢谢!

请参阅下面的我的代码段:

-video_size

1 个答案:

答案 0 :(得分:10)

这是一个你可能不知道的技巧:

ng-change="dialog(myDropDown)"         // pass the NEW value of myDropDown
ng-change="dialog('{{myDropDown}}')"   // pass the OLD value of myDropDown

调用dialog()时,您可以将之前选择的选项作为参数传递。

然后,如果对话框被取消,只需将其回滚。



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

app.controller('myCtrl', function($scope) {
    $scope.dialog = function(prev) {
        var dialog = confirm('Continue?');
        if(!dialog) {
            $scope.myDropDown = prev;
            alert("Option must not change");
        }
    }
});

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

<div ng-app="myApp" ng-controller="myCtrl">
  <select ng-model="myDropDown" ng-change="dialog('{{myDropDown}}')">
    <option>a</option>
    <option>b</option>
  </select>
</div>
&#13;
&#13;
&#13;