Angular と共に mvc4 アプリケーションでポップアップを表示するために、プレーンな ng-dialog を使用しています。ここに私のコードがあります
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');
}
});
以下のようにポップを開こうとしています
$scope.showAlertDetails = function () {
ngDialog.open({
template: 'firstDialogId',
controller: 'alertEditCtrl',
className: 'ngdialog-theme-default',
scope: $scope, // this line wasn't here before
closeByDocument: false
});
}
私のテンプレートは
<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>
私はhttp://ngmodules.org/modules/ngDialogを参照しています
AngularJS は、事前定義されたスクリプト テンプレートでポップアップを表示せず、テンプレート ID を mvc4 のアクションとして使用しています。