Angular -ui modal - передавать данные в модальные

Я пытаюсь передать некоторые данные модели в модальное окно, когда оно открыто. Когда пользователь нажимает на элемент, я хочу открыть окно мода и показать более подробную информацию о том, что было нажато.

Я создал plunker, который работает так, как я хочу, за исключением передачи данных в модальное окно.

Я пытаюсь передать данные с помощью ng-click:

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

Может ли кто-нибудь помочь мне с этим? или указать мне в правильном направлении?

Ответы

Ответ 1

Как насчет этого?

Я добавил элемент к решению

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

И в controller я делаю: $scope.item = item; после ввода item

Ответ 2

Я сделал плункер для вас в 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;
    }
  }
});

и в вашем модальном контроллере обязательно включите разрешенный объект размера следующим образом:

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');
  };
});

Ответ 3

Что сработало для меня, так это создать объект в resolve, который возвращает объект, содержащий переменные, которые я хотел бы разделить.

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

Чтобы получить доступ к объекту shared, включите его при определении вашего модального контроллера экземпляра.

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