Passing parameters to modal dialog

angular-ui-bootstrap, angularjs, javascript, twitter-bootstrap

Solution

You need to inject the item in controller injection:

You have this:

ItemDialogController.$inject = ["$scope", "$modalInstance"];

Change to:

 ItemDialogController.$inject = ["$scope", "$modalInstance", "item"];

Problem

I'm trying to use a simple modal dialog for editing an item in a list in the context of an Angular app. For modals I'm using UI-Bootstrap (AngularUI), which I know has still issues with Bootstrap 3 but AFAIK can be used for modals with some simple workarounds (unless building the not-yet-released branch of AngularUI). I created a simple repro Plunker here: http://plnkr.co/edit/MWa3bLMqIkwxmxQ6YDSl The sample code has a couple of controllers, one with an `open` method which should open the modal, and another with `save` and `close` methods for buttons save and cancel. Also, the CSS contains some workarounds for dealing with AngularUI issues with Bootstrap 3. The modal dialog is displayed, but it does not receive the parameter passed from the calling controller. To pass this parameter (a dummy `item` object with an id and a name) I use the `resolve` option in the modal open method call, like: ``` resolve: { item: function() { return angular.copy(item); } } ``` Yet, the `item` parameter which should be resolved in the dialog controller appears to be undefined. What I'm missing here? Thanks!

Original source