我正在使用Angular bootsrap模式服务。 ui-bootstrap的版本是ngular-ui-bootstrap 1.3.3
。下面是我的代码。
首先在模块上,我已正确注册。
var angularFormsApp = angular.module("angularFormsApp", ["ngRoute", "ui.bootstrap"]);
然后在角度控制器上,我正确地注入了这个指令。
var loginController = function ($scope, $window, $routeParams, $uibModal, DataService)
然后我通过跟随同一个控制器内的代码来调用这个模态
var onError = function (reason) {
$scope.modalOptions.headerText = "Error";
$scope.modalOptions.bodyText = reason.statusText;
$uibModal.open({
templateUrl: baseurl + 'app/ErrorMessages/PopUpErrorMessage.html',
controller: 'loginController'
});
};
$scope.cancelForm = function () {
$uibModalInstance.dismiss('cancel');
};
现在你可以看到我为modal创建了单独的html文件,下面是html
<div class="modal-header">
<h3>{{modalOptions.headerText}}</h3>
</div>
<div class="modal-body">
<p>{{modalOptions.bodyText}}</p>
</div>
<div class="modal-footer">
<input type="button" class="btn btn-default" value="Close"
ng-click="cancelForm()" />
</div>
现在直到这里一切正常,我的意思是错误方法,模态显示但问题是它显示空白,即使在关闭按钮点击时没有发生任何事情。
Chrome浏览器的控制台没有错误。这是屏幕截图。
答案 0 :(得分:2)
您的Modal不了解控制器的范围。尝试改为:
$uibModal.open({
templateUrl: baseurl + 'app/ErrorMessages/PopUpErrorMessage.html',
scope: $scope
});
答案 1 :(得分:0)
要使用当前的控制器变量,请尝试更改
controller: 'loginController'
到scope: $scope
。它会将当前范围传递给模态。