user846437
user846437

Reputation:

AngularJS: pass variable to modal

I use https://github.com/simpulton/angularjs-wizard for my project, it works, (I modified it a little, replaced var app to $scope)

but I need to pass a variable to open function:

$scope.open = function (image)
    {
        $scope.image = image;

        var modalInstance = $uibModal.open({
            templateUrl: 'wizard.html',
            controllerAs: 'modal',
            size: 'lg',
            controller: 'ModalCtrl',
            resolve: {
                image: function () {
                    return image;
                }
            }
        });

        modalInstance.result
            .then(function (data) {
                $scope.closeAlert();
                $scope.summary = data;
            }, function (reason) {
                $scope.reason = reason;
            });
    };

and in html:

ng-click="open(image)"

but image is undefined in my template

it works if I only just the modal window, with the example from https://angular-ui.github.io/bootstrap/#/modal, but not with this wizard example

update:

https://jsfiddle.net/Ginstay/znz64sk3/2/

yes, ajax is completed at the moment, when I open the modal window

and if I add a breakpoint to return image; image is there

Upvotes: 3

Views: 7013

Answers (2)

Harshil Kulkarni
Harshil Kulkarni

Reputation: 411

Try this one

angular.module('plunker', ['ui.bootstrap']);
var ModalDemoCtrl = function ($scope, $modal) {

var modalInstance = $modal.open({
  templateUrl: 'myModalContent.html',
  controller: ModalInstanceCtrl,
  resolve: {
    test: function () {
      return 'test variable';
    }
  }
});
};

var ModalInstanceCtrl = function ($scope, $modalInstance, test) {
  $scope.test = test;
};

Upvotes: 5

user846437
user846437

Reputation:

I figured it, I needed to add

$scope.image = image;

to ModalCtrl

Upvotes: 1

Related Questions