来自网站{AnglerJs $ http的回复

时间:2016-11-08 16:34:46

标签: angularjs rest http

您好我需要使用REST服务显示网站(200,404等)的响应。

我创建了部分代码,但我不知道如何显示结果

这是js

angular.module('demo', [])
.controller('Hello', function($scope, $http) {
    $http ({
      method: 'GET',
      url: 'http:/www.google.com'
    }).
        then(function(response) {
            $scope.greeting = response.data;
        });
})

这是html

  <body>
    <div ng-controller="Hello">
      <p>Result = {{greeting.content}}</p>
    </div>
  </body>

</html>

感谢您的帮助。

2 个答案:

答案 0 :(得分:0)

responseIHttpPromise<T>,其扩展为IPromise<IHttpPromiseCallbackArg<T>>

此界面如下所示:

interface IHttpPromiseCallbackArg<T> {
    data?: T;
    status?: number;
    headers?: IHttpHeadersGetter;
    config?: IRequestConfig;
    statusText?: string;
}

因此,您可以访问所需内容: response.status

使用您的代码:

angular
  .module('demo', [])
  .controller('Hello', HelloController)

function HelloController($scope, $http) {
    $http({
      method: 'GET',
      url: 'http://enable-cors.org'
    })
    .then(function(response) {
         var text = "The status: " + response.status;
      
         $scope.directResponse = response;
         $scope.greeting = {content: text};
         $scope.someVariable = text;
     });
  
}

/*
var $http = angular.injector(["ng"]).get("$http");

$http.get("http://enable-cors.org/").then(function(response) {
  console.log(response.status);
});
*/
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="demo" ng-controller="Hello">
    <p>Status = {{directResponse.status}}</p>
    <p>Result = {{greeting.content}}</p>
    <p>Result = {{someVariable}}</p>
</div>

答案 1 :(得分:0)

您应该将$ http调用放入单独的服务并将其注入控制器。

这样的事情:

angular.module('demo')
.factory('greetingService', function($http) {
   this.getGreeting = function() {
        return $http ({
            method: 'GET',
            url: 'http:/www.google.com'
        }).then(function(response) {
           return response.data
        });
   }
};

然后将服务注入您的控制器并调用greetingService.getGreeting,然后将$ scope变量设置为结果。

另外,请确保您的请求中包含正确的标题。