$ http.get之后用户界面未更新

Question

嗨，我有以下angular.js控制器。

function WorkSpacesController($scope, $http, notifications) {
  $scope.Workspaces = [];
  $scope.Query = "";
  $http.get("api/Workspaces/GetAllWorkspaces/").then(function(response) {
      for (var i = 0; i < response.data.length; i++) {
          $scope.Workspaces.push(response.data[i]);
          notifications.showSuccess("Added new Item");
      }
  },
  function(data) {
      notifications.showError("Could not load workspaces");
  });
}

notifications.showSuccess和notifications.showError方法在屏幕上显示通知。 使用此脚本： https : //github.com/alexbeletsky/ng-notifications-bar 。

奇怪的是， showSuccess方法实际上有效并显示通知，而showError不起作用且不显示任何内容。 我调试了代码，一切看起来都很好，将消息添加到了消息数组中，没有收到错误。 我还尝试调用showError而不是showSuccess来验证其不是错误，并且可以正常工作。

关于调用showError时为什么不更新UI的任何想法？

Answer 1

我认为您的问题可能在通知服务内部，因为以下示例正常运行。

 angular.module('app', []).controller('WorkspacesController', function($scope, $http, notifications, $templateCache) { $scope.Workspaces = []; $scope.Query = ""; //for the purposes of this example, put a url into the http cache so we can load it without an actual http request //try a successful request $http.get('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css').then(function(response) { //for (var i = 0; i < response.data.length; i++) { //$scope.Workspaces.push(response.data[i]); notifications.showSuccess("Added new Item (for good request)"); //} }, function(data) { notifications.showError("Could not load workspaces (for good request)"); }); //try a failed request $http.get('url_that_does_not_exist').then(function(response) { //for (var i = 0; i < response.data.length; i++) { //$scope.Workspaces.push(response.data[i]); notifications.showSuccess("Added new Item (for bad request)"); //} }, function(data) { notifications.showError("Could not load workspaces (for bad request)"); }); }).service('notifications', function() { return { showSuccess: function(message) { alert('Success: ' + message); }, showError: function(message) { alert('Error: ' + message); } }; })

 <!DOCTYPE html> <html ng-app="app"> <head> <script data-require="angular.js@1.5.0" data-semver="1.5.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script> <link rel="stylesheet" href="style.css" /> <script src="script.js"></script> </head> <body ng-controller="WorkspacesController as vm"> </body> </html>

$ http.get之后用户界面未更新

问题描述

1 个解决方案

解决方案1
0 2016-03-09 13:14:50

$ http.get之后用户界面未更新

问题描述

1 个解决方案

解决方案1 0 2016-03-09 13:14:50

解决方案1
0 2016-03-09 13:14:50