遇到的问题

1ui-bootstrap的模态框虽然难用，但是功能及其强大，基本上所有的功能都可以定制。首先这个模态框指令分成三个部分，html,模态框的controller，主控制器中的模态框配置。

$scope.animationsEnabled = true;
$scope.open = function (size) {
   //配置模态框的参数
   var modalInstance = $uibModal.open({
      animation: $scope.animationsEnabled,//打开时是否出现动画
      templateUrl: '../../views/templateHtml/articleModal.html',//模态框的html地址
      controller: 'ModalInstanceCtrl',//这是模态框的控制器
      size: size,//模态框的大小尺寸
      resolve: {//这是一个入参,这个很重要,它可以把主控制器中的参数传到模态框控制器中
         type: function () {//type是一个回调函数
            return $scope.type;//这个值会被模态框的控制器获取到
         }
      }
   });
   
   modalInstance.result.then(function (result) {
//回掉函数，ok方法执行后执行
   }, function (result) {
      // dismiss方法执行后执行
      
   });
};

模态框的控制器

app.controller('ModalInstanceCtrl', function ($scope, $uibModalInstance,type) {
//这是模态框的控制器,记住$uibModalInstance这个是用来调用函数将模态框内的数据传到外层控制器中的,type是主控制器里传过来的数据
      if(type==="delete"){
         $scope. operationTips="确定要删除这篇文章吗？"
      }else{
         $scope. operationTips="确定要改变文章状态吗？"
      }
      $scope.ok = function () {
         //close函数是在模态框关闭后调用的函数,他会将close方法参数传到主控制器的results函数中,也就是modalInstance.result.then(function(result){})这句话中的function(result)里的result
         $uibModalInstance.close(type);
      };
      $scope.cancel = function () {
         
//dismiss也是在模态框关闭的时候进行调用,而它返回的是一个reason
//相对的clsoe则是结果，两者的区别主要是语义化上的区别，功能实际上一致
         $uibModalInstance.dismiss();
      };
   });

ui-bootstrap相对于传统的模态框来说，其优点是可以在模态框和主控制器之间传递数据，也就是说，模态框是一个动态的可定制的。