繁体   English   中英

Angular JS $ scope在Jquery函数中不起作用

[英]Angular js $scope is not working inside Jquery function

我正在使用Sweet Alert发出警报消息。 我有确认警报框,确认后我禁用了我的内容,但不是禁用$scopeswal()如果单击两次它在起作用。我如何使其工作。 我的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;

    }
});

我的示例代码启用正常,禁用内部功能确认不起作用。 请帮忙。 提前致谢。

只需在角度$scope.$apply之外发生某些事情时使用$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; } }); 
 <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> 

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM