我有一种情况,当我点击按钮时,调用控制器方法。 $ http.get会给我一个URL作为回复。当我点击该URL时,我得到bootstrap模态(所有模态html)作为响应。我想将模态响应显示到我所拥有的bootstrap模态中。
我该怎么做?
按钮:
<button type="button" class="btn btn-primary" data-target="#pwdConfirm" ng-click="doMethod('ResetPassword',@Model.Id)"><span class="col-sm-12 fa fa-refresh"> Reset Password</span></button>
控制器代码:
$scope.doMethod = function (method, Id) {
var userId = Id;
var url = "http://" + $window.location.host+ "/User/" +method+"?id=" + userId;
//var url = $window.location.host + "/User/" + method + "?id=" + userId;
$http({
method: 'GET',
url: url
}).success(function (response) {
$scope.successresponse = response;
console.log(response);
}).error(function (response) {
alert(response);
});
来自console.log语句的控制器响应:
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Password Reset</h4>
</div>
<div class="modal-body">
<div class="col-md-12">
<img src="/Content/images/greenCheck.png" title="logo" class="imgLogo" />
</div>
<div class="col-md-12">
<p>Password Reset to Default</p>
</div>
</div>
<div class="form-group">
<div class="control-label col-md-4"></div>
<div class="col-md-8">
Password : bforce
</div>
</div>
<div class="modal-footer">
<div class="col-md-6 row">
<a class="page-header fa fa-edit btn btn-warning" href="/User/Index" style="color:white">Activate later</a>
</div>
</div>
</div>
现在我希望这个响应在另一个页面中显示为一个boostrap模式。我怎样才能做到这一点 ?
答案 0 :(得分:0)
$scope.doMethod = function (method, Id) {
var userId = Id;
var url = "http://" + $window.location.host+ "/User/" +method+"?id=" + userId;
//var url = $window.location.host + "/User/" + method + "?id=" + userId;
$http({
method: 'GET',
url: url
}).success(function (response) {
$scope.successresponse = response;
console.log(response);
var showBadRoleModelInstance = $modal.open({
template: "<div ng-bind-html='htmlContent'></div>",
backdrop: true,
windowClass: 'modal',
controller: modalController,
resolve: {
htmlContent: function () {
return response;
}
}
});
}).error(function (response) {
alert(response);
});
function modalController(htmlContent){
$scope.htmlContent = htmlContent;
}