一尘不染

Angular-ui模态,从$ http将数据发送到模态控制器

angularjs

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

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

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

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?


阅读 200

收藏
2020-07-04

共1个答案

一尘不染

您可以尝试类似

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

基本上,您$modal可以承诺,为什么不使用它。现在,当承诺得到解决时,该对象应该在控制器上可用。该ModalInstanceCtrl

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

因为您要解决的是items财产,而不是selectedProduct财产。

2020-07-04