为什么角度带模态的范围在modal.hide中不会改变?

时间:2016-04-18 08:12:49

标签: angularjs angular-strap

我需要在angular-strap中创建一个删除确认模式。这是我的代码,我试图显示确认模式:

 $scope.deleteConfirm = function(){
    var delete_scope = $scope.$new(true);
    delete_scope.delete = false ;
    delete_scope.test = "default"; 
    var confModal = $modal({title: 'Confirm', scope:delete_scope, prefixEvent:'conf.event', templateUrl:"ui_component/confirm-mdl.tpl.html", controller:"mdlConfirmCtrl", show:false});
    confModal.$promise.then(confModal.show);
};

这是我的模态的隐藏事件处理程序:

$scope.$on('conf.event.hide.before', function(event, data){
    console.log(data.$scope.test) ;
    if(data.$scope.delete) {
        console.log('deleted') ;
    }
    // optional
    //$scope.$apply();
});

这是 mdlConfirmCtrl

的代码
angular.module("taxeeApp").controller("mdlConfirmCtrl",function($scope){
    $scope.toggleFlag = function(){
        console.log($scope.delete) ;
        $scope.delete = !$scope.delete ;
        $scope.test = "value has been changed!!!" ;
        console.log($scope.delete) ;
    } ;
});

但是当我调用mdlConfirm Controller的toggleFlag函数并关闭模态时,我得到默认值 delete_scope.test delete.delete

这是我的模态模板:

<div class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <form name="form" novalidate>
            <div class="modal-header">
                <h4 class="modal-title"> Why do you want to delete ? </h4>
            </div>
            <div class="modal-body">
                <!--label><input type="radio" ng-model="reason" value="bored" required /> Bored :( </label>
                <label><input type="radio" ng-model="reason" value="over excited" required /> Over Excited :D </label>
                <label><input type="radio" ng-model="reason" value="exams" required /> Exams :p </label-->
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" ng-click="toggleFlag(); $hide() "> Cancel </button>
                <button type="button" class="btn btn-primary" ng-click="toggleFlag(); $hide() "> Delete </button>
            </div>
        </form>
    </div>
</div>

我怎样才能获得此更改?

1 个答案:

答案 0 :(得分:0)

我通过将delete_scope更改为以下内容来解决此问题:

var delete_scope = $scope.$new(true);
delete_scope.test={delete : false , test :"default"};

instate of:

var delete_scope = $scope.$new(true);
delete_scope.delete = false ;
delete_scope.test = "default"; 

:)