angularJs $mdDialog和$uibModal弹框关闭传值

Posted ~西门紫凌~

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了angularJs $mdDialog和$uibModal弹框关闭传值相关的知识,希望对你有一定的参考价值。

$mdDialog以一个点击button按钮出现弹框为例:

 $scope.btn=function($event,row){

  var dScope = $scope.$new(true);

  dScope.row = row;//从新new一个$scope,把当前值带到弹框中,页面可直接绑定收据,js用前加$scope

  $mdDialog.show({

    scope:dScope,

    parent:angular.element(document.body),

    targetEvent: $event,

    size:‘sm‘,

    clickOutsideToClose:false, //点击弹框外是否关闭弹框

    templateUrl:‘弹框的页面所在路径‘,

    locals:{store:$scope.store}, //这个在弹框的controller里边运用不需要再加$scope,所以不能双向绑定到页面,如果要绑定到页面需要从新赋值

    controller:[‘$scope‘,function($scope){

      //.........弹框里边的一些逻辑.............

      比如我里边有个逻辑执行完成后弹框关闭,想要把里边的一个$scope.currentValue值返回到主页面中

      那么执行弹框关闭的方法是$mdDialog.cancel($scope.currentValue),只要把值传过来就行了。在下边then的回调函数function会接收到这个值

    }]

  }).then(function(ret){

    // 这里边是接收$mdDialog.hide()传过来的值

  },function(ret){

    // 这里边是接收$mdDialog.cancel()传过来的值

    比如我的主页面绑定值是$scope.currentVal =  ret;

  });

};

$uibModal以一个点击button按钮出现弹框为例:

  $scope.btn=function(oper){

    var dScope = $scope.$new(true);

    dScope.oper = oper;//这个值传到弹框页面可直接绑定数据,js里用前加$scope

    var modalInstance = $uibModal.open({

      scope:dScope,

      animation: true,

      templateUrl:‘弹框页面所在路径‘,

      controller: ‘btnCtrl‘,   //弹框的controller

      size:‘lg‘  //控制弹框大小 /sm

    });

  }

以上是关于angularJs $mdDialog和$uibModal弹框关闭传值的主要内容,如果未能解决你的问题,请参考以下文章

AngularJS页面uib-dropdown控件在模态窗口(弹出窗)中无法使用问题

AngularJs的UI组件ui-Bootstrap分享(十三)——Progressbar

使用 uib-accordion 的条件标题颜色

AngularJs的UI组件ui-Bootstrap分享——Accordion

AngularJs的UI组件ui-Bootstrap分享——Accordion

AngularJs的UI组件ui-Bootstrap分享——Tooltip和Popover