1

I'm using Angular-ui modal instance and i'm trying to get the return value but for some reason the bindings is not working correctly

var openNewAlbum = function() {

            var modal = $modal.open({
                templateUrl :'/app/modals/NewAlbumModal.html',
                controller  : function($scope, $modalInstance) {

                    $scope.albumTitle;

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

                    $scope.accept = function() {
                        $modalInstance.close($scope.albumTitle);
                    }

                },
                keyboard: false,
                backdrop: 'static'
            });

            return modal;

        }

this is in the controller:

$scope.newAlbum = function() {

            var modalInstance = ModalService.openNewAlbum();

            modalInstance.result.then(function(response) {

                console.log(response);

            });

        }

the var response that gets logged is Whatever I assign to it inside the Modal's Controller and not what gets passed in the in Input

here is the modal template:

<div style="padding:6px">

    <div class="modal-body" style="font-weigth:bold;font-size:18px">

        <label for="">Nombre del Album</label>
        <input class="form-control" type="text" ng-model="albumTitle">
        {{albumTitle}}
        <br>

    </div>  

    <button class="btn btn-danger" ng-click="cancel()" >Cancelar</button>
    <button class="btn btn-primary pull-right" ng-click="accept()">Aceptar</button>

</div>

when checking {{albumTitle}} I cant see that it changes, but when I click Accept, the return value is ' ' ....... (the value that was assign to $scope.albumTitle = '';)

Gabriel Matusevich
  • 3,835
  • 10
  • 39
  • 58
  • modalinstace uses it's own scope, to change the root scope you need to assign them back to your parent scope's variables in the callbacks `.then(closecallback,dismisscallback)`. i.e. you need to do `$scope.albumTitle = response` right below your `console.log` – Quad May 28 '14 at 00:26
  • no. u got it wrong. response its empty – Gabriel Matusevich May 28 '14 at 00:29
  • ah yes, i got it wrong then may be try `ng-click="accept(albumTitle)"` and `$scope.accept = function(title){ $modalInstance.close(title); }` – Quad May 28 '14 at 00:32
  • I would initialize `$scope.albumTitle = '';` in the controller function. If I remember correctly, while working with angular at that time, I started initializing all variables because of some problems I had. – darijan Nov 21 '15 at 12:30

0 Answers0