ngdialog template is being opened

Question

i am using plain ng-dialog for showing popup in my mvc4 application along with Angular. here is my code

 var myAPP = angular.module('myAPP', [ 'ngSanitize',   'jsonDateFilters', 'timer', 'ngDialog']);

 myAPP.config(function ($provide,  $controllerProvider,  compileProvider, ngDialogProvider) {
myAPP.controllerProvider = $controllerProvider;
myAPP.compileProvider = $compileProvider;

ngDialogProvider.setDefaults({
    className: 'ngdialog-theme-default',
    plain: false,
    showClose: true,
    closeByDocument: true,
    closeByEscape: true,
    appendTo: false,
    preCloseCallback: function () {
        console.log('default pre-close callback');
    }
 });

I am trying to open a pop as given below

    $scope.showAlertDetails = function () {

    ngDialog.open({
        template: 'firstDialogId',
        controller: 'alertEditCtrl',
        className: 'ngdialog-theme-default',
            scope: $scope, // this line wasn't here before
    closeByDocument: false
    });
}

My template is

<script type="text/ng-template" id="firstDialogId" >

<div class="ngdialog-message">
    <h3>ngDialog template</h3>

</div>
<div class="ngdialog-buttons">

    <button type="button" class="ngdialog-button ngdialog-button-primary" ng-click="openSecond()">Open next</button>
</div>
</script>

i am refering http://ngmodules.org/modules/ngDialog

AngularJS is not showing pop up with predefined script template, rather it is taking template id as action in mvc4.

Answer 1

I found its root cause, my template was not written in the controller. That's what was causing the problem.