Angular-ui bootstrap模式按钮不会执行函数

Angular-ui bootstrap modal button will not execute function

本文关键字：执行 函数 按钮 bootstrap 模式 Angular-ui      更新时间：2023-09-26

我把我的模态设置为

<script type="text/ng-template" id="myModalContent.html">
    <div class="modal-header">
        <h3 class="modal-title">Confirm</h3>
    </div>
    <div class="modal-body">
        <p>Are you sure you want to remove Two Factor Authentication from your profile?</p>
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" ng-click="removeSetting()">Yes</button>
        <button class="btn btn-warning" ng-click="$dismiss()">Cancel</button>
    </div>
</script>

点击取消按钮做它应该做的，只是关闭模式。当用户点击yes按钮时，我的问题就出现了。我的函数removeSetting()永远不会被执行。

$scope.removeSetting = function() {
        TwoFactorAuthenticationService.removetAuthetication().then(function(data) {
            $scope.busy3=false;
            notifyService.alert("error", notifyService.getAlertText('2FactorRemovedToken'));
            $scope.busy=true;
            $timeout(function() {
                $scope.templateUrl = 'twofactorsetup/step1.html';
            }, 3000);
        }, function() {
            notifyService.alert("error", notifyService.getAlertText('2FactorRemoveTokenFailed'));
        });
    };

是应该被调用和执行的函数。我错过了什么?

在modal initialize中放置这样的代码

$modal.open({
    templateUrl: 'myModalContent.html',
    scope: $scope,
    controller: function($scope, $modalInstance) {
        $scope.removeSetting = function() {
            //place your code here or call function from parent scope
            $scope.$parent.removeSetting();
            $modalInstance.dismiss('cancel');
        };
    }
});

如果不使用父作用域，则不需要作用域参数。

或者你可以像这样从模板中调用父作用域的函数(通过使用$parent. removessetting () call)

<script type="text/ng-template" id="myModalContent.html">
    <div class="modal-header">
        <h3 class="modal-title">Confirm</h3>
    </div>
    <div class="modal-body">
        <p>Are you sure you want to remove Two Factor Authentication from your profile?</p>
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" ng-click="$parent.removeSetting()">Yes</button>
        <button class="btn btn-warning" ng-click="$dismiss()">Cancel</button>
    </div>
</script>
相关文章：