如何将http响应发送到angularjs对话框中

How to send http response into dialog box into angularjs?

本文关键字:angularjs 对话框 http 响应      更新时间:2023-09-26

我想把从后端得到的响应发送到对话框,当我点击OK时,它会重定向到主页。就像我们使用alert来显示响应一样。

这就像,我正在更新一些员工信息,更新后,我会给出一些响应,如updated_date和updated_by。我想在对话框中显示这些信息。当我点击OK按钮时,它会重定向到主页,在那里列出了所有员工。

所以我的问题是如何将响应发送到对话框模板。我下面的代码我使用警报来显示响应,但需要一些对话框窗口来弹出,如演示

对话框模板

<div class="modal-body">
    {{text}}
</div>
<div class="modal-footer">
    <button class="btn btn-primary" ng-click="ok()">OK</button>    
</div>

在我的主控制器中,我得到了类似的响应

$scope.getInfo=function(){     
  var empData={some info}
  $http.post(api,empData)
  .success(function(response, status){
      alert(response);
      $state.go("home");
  });
}

在这里,我使用alert来显示响应,而不是alert,我想使用对话框之类的东西

您可能会从使用angular ui bootstrap框架中受益,该框架在许多ui组件中实现了一个模态组件。

这就是您链接的plunker的作用,包括//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.js//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css

您可以使用lib-ngDialog

http://likeastore.github.io/ngDialog/

打开对话框:

var dialog = ngDialog.open({
    template: 'externalTemplate.html'
});
dialog.closePromise.then(function (data) {
    console.log(data.id + ' has been dismissed.');
});

模板:

<script type="text/ng-template" id="externalTemplate.html">
<div class="dialog-contents">
    <input type="text"/>
    <input type="button" value="OK" ng-click="checkInput() && closeThisDialog('Some value')"/>
</div>
</script>

将后端值分配给您在.success函数中的模态中使用的变量$scope.text=empdata;