CODEWITHSUNDEEP
javascripthtmlangularjstwitter-bootstrapmodal-dialog
vrghost
vrghost

Reputation: 1224

Angular-modal-service does not show modal

Trying to set up a (I think) relatively simple modal to show the sites cookie policy.

The policy is on /cookiepolicy. Checked and that link works nicely.

I then created a button (that does call the code)

<a class="btn btn-default" href ng-click="showCookie()">Read More</a>

As I just want to call the modal for the url, nothing more is added to the html.

The function that calls the modal (which also is called and reports success as per the last line.)

app.controller('IndexController', function($scope, ModalService) {
    $scope.showCookie = function (data) {
        ModalService.showModal({
            templateUrl: "/cookie-policy",
            controller: "ModalController"
        }).then(function (modal) {

            //it's a bootstrap element, use 'modal' to show it
            modal.element.modal;
            modal.close.then(function (result) {
                console.log(result);
            });
        });
    }
});

The modal also have its own controller

betchaHttp.controller('ModalController', function($scope, close) {

    // when you need to close the modal, call close
    close("Success!");
});

The thing is that when I press it, nothing comes up on the page, neither is there a error message. Am I missing something rather obvious (or not so obvious)

Upvotes: 1

Views: 1496

Answers (1)

scniro
scniro

Reputation: 16989

Fortunately, this is just a small syntax typo on your end. Observe your .then() block and change...

modal.element.modal;     // -- nothing

to

modal.element.modal();  // -- fn call

JSFiddle Link - demo

Upvotes: 2

Related Questions