繁体   English   中英

Angular-UI模态-将数据传递到模态

[英]Angular-ui modal - pass data into modal

我正在尝试将一些模型数据打开时传递给模式窗口。 当用户单击某个元素时,我想打开模式窗口并显示与单击的内容有关的更详细的信息。

我创建了一个插件 ,该插件可以将数据传递到模态窗口中,除了我希望的那样工作。

我正在尝试使用ng-click传递数据:

<img ng-src="{{item.picture}}" width="100" ng-click="open(item)"/>

谁能帮我这个? 或指出正确的方向?

这样呢?

我添加了解决方案

resolve: {
    items: function () {
        return $scope.items;
    },
    item: function(){
        return size;
    }
}

controller我正在做: $scope.item = item; 注入item

我在http://plnkr.co/FzU5SOv3pdZmAPAIOzdo上为您做了一个小矮人。

您希望像当前​​处理项目一样解析数据。

$scope.open = function (size) {

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

并确保在模态控制器中包括如下所示的现在解析的size对象:

angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items, size) {

  $scope.items = items;
  $scope.selected = {
    item: $scope.items[0]
  };
  $scope.size = size;

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

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

对我有用的是在resolve中创建一个对象,该对象返回一个包含要共享的变量的对象。

resolve: {
  shared: function(){
    return {
      name: 'Spencer',
      numbers: [1, 2, 3]
    }
  }
}

要访问shared对象,请在定义模式实例控制器时将其包括在内。

app.controller('ModalInstanceController', function($scope, shared, $uibModalInstance,

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM