Where is $dialog.messageBox() in Angular UI?

Question

I could not find $dialog service in AngularUI and I tried to explore a simple messageBox() to create a confirmation dialog box using $modal. Could not find that either.

Can somebody suggest me how to create a simple dialog (say for delete confirmation) using AngularJS / AngularUI?

Thank you in advance.

Answer 1

The $dialog service was refactored into $modal for version 0.6.0 of ui-bootstrap. The functionality from $dialog should still be available, just through $modal instead.

According to the docs, you should make sure you have included bootstrap's css and angular.js in your page as well as bootstrap-ui's JS, which you can download from the doc site. I'd look at the 'create your own' link if you only need to use the $modal service and not the other directives.

If these files are included in your page, then make sure the definition of your angular module includes ui.bootstrap as a dependency. e.g.

var app = angular.module('myApp', ['ui.bootstrap']);

If this is done then you should be able to inject the $modal service within your module, like you would with any other service.

app.controller('myController', function($scope, $modal) {
    $scope.openModal = function() {
       // Can use $modal service as per examples in doc page
    };
});

As for solid examples, the docs page has great examples on the page and in plunker (so you can play with them) for each of their services and directives. I would like to link to the plunker here, but I don't seem able to.