我正在使用Sweet警报来发送警报消息。我有确认提示框,确认后我已经禁用了我的内容但是没有禁用$scope
在swal()
内部无效,如果点击两次它正在工作。我可以让它工作。
我的HTML代码:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://limonte.github.io/sweetalert2/dist/sweetalert2.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script type="text/javascript" src="http://limonte.github.io/sweetalert2/dist/sweetalert2.min.js"></script>
<script type="text/javascript" src="js/myscript.js"></script>
</head>
<body ng-app="app" ng-controller="myController">
Supplier ID:<input type="text" ng-model="supplierID" ng-disabled="disable"/><br>
Series ID:<input type="text" ng-model="seriesID" ng-disabled="disable"/><br>
SKU ID:<input type="text" ng-model="skuID" ng-disabled="disable"/><br><br>
<div class="action-keys">
<button class="btn btn-default" ng-click="enable()" ng-disabled="!disable">Enable</button>
<button class="btn btn-default" ng-click="disableCall()" ng-disabled="disable">Disable</button>
</div>
</body>
和我的myscript.js
:
angular.module('app', [])
.controller('myController', function($scope) {
$scope.disable = false;
$scope.disableCall = function () {
swal(
{
title: 'Warning',text: 'Are you want to disable?',type: 'warning',showCancelButton: true,confirmButtonColor: '#3085d6',cancelButtonColor: '#d33',
confirmButtonText: 'Yes',cancelButtonText: 'No',confirmButtonClass: 'confirm-class',cancelButtonClass: 'cancel-class',allowOutsideClick : false
},function(isConfirm) {
if (isConfirm) {
$scope.skuID = '';
$scope.seriesID = '';
$scope.supplierID = '';
$scope.disable = true;
}else{
return;
}
});
}
$scope.enable = function () {
$scope.skuID = '';
$scope.seriesID = '';
$scope.supplierID = '';
$scope.disable = false;
}
});
这个我的示例代码启用工作正常,禁用内部功能确认不起作用。请帮忙。提前谢谢。
答案 0 :(得分:6)
只有在角度以外发生的事情时才使用$scope.$apply
。注意电话
$scope.$apply(function(){
//everything here will trigger digest cycle
//everything...
});
angular.module('app', [])
.controller('myController', function($scope) {
$scope.disable = false;
$scope.disableCall = function () {
swal(
{
title: 'Warning',text: 'Are you want to disable?',type: 'warning',showCancelButton: true,confirmButtonColor: '#3085d6',cancelButtonColor: '#d33',
confirmButtonText: 'Yes',cancelButtonText: 'No',confirmButtonClass: 'confirm-class',cancelButtonClass: 'cancel-class',allowOutsideClick : false
},function(isConfirm) {
if (isConfirm) {
$scope.$apply(function(){
$scope.skuID = '';
$scope.seriesID = '';
$scope.supplierID = '';
$scope.disable = true;
});
}else{
return;
}
});
}
$scope.enable = function () {
$scope.skuID = '';
$scope.seriesID = '';
$scope.supplierID = '';
$scope.disable = false;
}
});
&#13;
<link rel="stylesheet" href="http://limonte.github.io/sweetalert2/dist/sweetalert2.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script type="text/javascript" src="http://limonte.github.io/sweetalert2/dist/sweetalert2.min.js"></script>
<div ng-app="app" ng-controller="myController">
Supplier ID:<input type="text" ng-model="supplierID" ng-disabled="disable"/><br>
Series ID:<input type="text" ng-model="seriesID" ng-disabled="disable"/><br>
SKU ID:<input type="text" ng-model="skuID" ng-disabled="disable"/><br><br>
<div class="action-keys">
<button class="btn btn-default" ng-click="enable()" ng-disabled="!disable">Enable</button>
<button class="btn btn-default" ng-click="disableCall()" ng-disabled="disable">Disable</button>
</div>
</div>
&#13;