I am having trouble implementing the angular modal service in my web application. When I click on the button, the modal does not appear. Can someone help me figure out what I am doing wrong?
Builder View
<div ng-controller="BuilderController as vm">
<button type="button" class="btn btn-success" ng-click="vm.showExportModal()">Export</button>
</div>
Builder Controller
angular.module('myWebApp')
.controller('BuilderController', function ($scope, BuilderService) {
var vm = this;
vm.showExportModal = function() {
BuilderService.showExportModal();
};
});
Builder Service
angular.module('myWebApp')
.service('BuilderService', function (ModalService) {
var builderService = {
showExportModal: showExportModal
};
return builderService;
function showExportModal() {
ModalService.showModal({
template: "<div>Fry lives in {{futurama.city}}</div>",
controller: function() {
this.city = "New New York";
},
controllerAs : "futurama"
})
};
});