1. 程式人生 > >angularJs $mdDialog和$uibModal彈框關閉傳值

angularJs $mdDialog和$uibModal彈框關閉傳值

lose 關閉 ctr oda 如果 dial lar 當前 直接

$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彈框關閉傳值