向模态控制器发送数据

向模态控制器发送数据

本文介绍了Angular-ui 模态,从 $http 向模态控制器发送数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 angular-ui 模态指令 http://angular-ui.github.io/bootstrap/ .

I'm using the angular-ui modal directive http://angular-ui.github.io/bootstrap/ .

我遵循了上面链接中的示例.

I have followed the example from the link above.

这是我想从我的控制器发送的数据:

This is my data I want to send from my controller:

ProductsFactory.getOneProduct().then(function(d){
  $scope.selectedProduct = d.data;
});

$scope.open = function () {
  var modalInstance = $modal.open({
    controller: 'ModalInstanceCtrl',
    templateUrl: 'productDetail.html',
    resolve: {
      items: function () {
        return $scope.selectedProduct;
      }
    }
  });
};

这是我的模态控制器:

var ModalInstanceCtrl = function ($scope, $modalInstance, selectedProduct) {

  console.log(selectedProduct);

  $scope.ok = function () {
    $modalInstance.close();
  };

  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };
};

问题是我无法访问 Modal 控制器中的选定产品".我知道原因是宽度异步调用,它只能从 GUI 访问.但是我该如何解决这个问题呢?我如何将$scope.selectedProduct"发送到我的 ModalInstanceCtrl?

Problem is i can't access the "selected product" in my Modal controller. I know the reason is something to do width asyncrnous call and it can only be access from the GUI. But how do I solve this issue? How do i send the "$scope.selectedProduct" to my ModalInstanceCtrl?

推荐答案

你可以尝试类似的事情

$scope.open = function () {
  var modalInstance = $modal.open({
    controller: 'ModalInstanceCtrl',
    templateUrl: 'productDetail.html',
    resolve: {
      items: function () {
        return ProductsFactory.getOneProduct();
      }
    }
  });
};

基本上你的 $modal 可以接受一个承诺,所以为什么不使用它.现在,当承诺得到解决时,该对象应该在控制器上可用.ModalInstanceCtrl 应该是

Basically your $modal can take a promise, so why not use it. Now the object should be available on the controller when the promise gets resolved. The ModalInstanceCtrl should be

var ModalInstanceCtrl = function ($scope, $modalInstance, items) {

因为您正在解析 items 属性而不是 selectedProduct 属性.

since you are resolving the items property not the selectedProduct property.

这篇关于Angular-ui 模态,从 $http 向模态控制器发送数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-06 00:55