标签: angular-http

使用AngularJS'$ http服务通过GET请求发送数组

我需要使用该$http服务发送GET请求.其中一个参数是一组id.网址看起来像这个mysite.com/items?id[]=1&id[]=2&id[]=3&id[]=4

我试过这种方法

$http(
  method: 'GET',
  url: '/items',
  params: {
    id: ids // ids is [1, 2, 3, 4]
  }
)
Run Code Online (Sandbox Code Playgroud)

但我记下的网址是mysite.com/items?id=%5B%221%22%2C%222%22%2C%223%22%2C%224%22%5D

那是因为Angular在JSON字符串中转换我的值.有没有办法得到我想要的行为?

[更新]

由于Jonathan建议使用jQuery,我解决了这个问题$.param().

$http(
  method: 'GET'
  url: '/items?' + $.param({id: ids})
)
Run Code Online (Sandbox Code Playgroud)

javascript http angularjs angular-http

48
推荐指数
4
解决办法
7万
查看次数

Angular 2 http得不到

我刚开始学习Angular 2我正在尝试使用get调用来访问URL,但是即使在浏览器的网络中,get似乎也没有通过我无法找到获取URL的URL.

该程序将进入上面和下面的方法控制台记录,但是get调用没有任何内容

我的服务方式

import { Headers, Http, Response } from '@angular/http';
import { Injectable } from '@angular/core';
import { Persons } from './mock-people';
import { Person } from './person';
import {Observable} from 'rxjs/Rx';

getAllPersons(): void {
  console.log("Here");
  this.http.get(`http://swapi.co/api/people/1`)
    .map((response: Response) => {
      console.log(response.json());
      response.json();
    });
  console.log("Comes here 2");
}
Run Code Online (Sandbox Code Playgroud)

进口HttpModule在app.module.ts

我的控制台屏幕截图

安慰]

angular-http angular

47
推荐指数
1
解决办法
4万
查看次数

如果responseType是arraybuffer,如何从$ http读取JSON错误响应

我使用加载一些二进制数据

$http.post(url, data, { responseType: "arraybuffer" }).success(
            function (data) { /*  */ });
Run Code Online (Sandbox Code Playgroud)

如果出现错误,服务器会响应错误的JSON对象

{ "message" : "something went wrong!" }
Run Code Online (Sandbox Code Playgroud)

有没有办法以不同于成功响应的类型获取错误响应?

$http.post(url, data, { responseType: "arraybuffer" })
  .success(function (data) { /*  */ })
  .error(function (data) { /* how to access data.message ??? */ })
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angular-http

42
推荐指数
2
解决办法
1万
查看次数

如何读取angularjs中的响应头?

我的服务器返回这种标题Content-Range:0-10/0::

在此输入图像描述

我试着用角度读这个标题而没有运气:

var promise = $http.get(url, {
    params: query
}).then(function(response) {
  console.log(response.headers());
  return response.data;
});
Run Code Online (Sandbox Code Playgroud)

只打印

Object {content-type: "application/json; charset=utf-8"}
Run Code Online (Sandbox Code Playgroud)

任何想法如何访问内容范围标题?

javascript angularjs angular-http

31
推荐指数
4
解决办法
10万
查看次数

Angular 2:没有ConnectionBackend的提供者

得到这个"ConnectionBackend没有提供者!" 尝试使用httppromise 时出错.

main.ts

// ... tl;dr import a bunch of stuff

platformBrowserDynamic().bootstrapModule(MyModule);
Run Code Online (Sandbox Code Playgroud)

myModule.ts

// ... tl;dr import a bunch of stuff

@NgModule({
 declarations: [
        PostComponent
  ],
  providers: [
    Actions,
    MyService,
    Http
  ],
  imports: [
    ...
  ],
  bootstrap: [MyComponent]
})
Run Code Online (Sandbox Code Playgroud)

myComponent.ts

import { Component, OnInit } from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {Observable} from 'rxjs/Observable';
import {MyService} from './../services/myService'
import {Post} from './post';

@Component({
  templateUrl: 'post.component.html',
  styleUrls: ['post.component.css']
})
export class MyComponent implements OnInit {
  post: …
Run Code Online (Sandbox Code Playgroud)

angular-http angular

28
推荐指数
1
解决办法
4万
查看次数

HTTP错误处理如何与observable一起使用?

我看到很多教程做了这样的事情:

http.get("...").subscribe(
  success => console.log('hello success'),
  error => console.log('bye error')
);
Run Code Online (Sandbox Code Playgroud)

我不知道它是如何工作的,因为没有任何类型或任何东西,但是我试图自己这样做,我最终得到请求总是成功,即使我有一个错误.问题是什么?

麻烦制造者:

this.memberService.create(this.currentMember)
      .subscribe(
        success => {
          let mem: Member = success.json() as Member;
          if (this.selectedOrganization) {
            this.addMemberToOrganization(mem);
          } else if (this.selectedServiceProvider) {
            this.addMemberToServiceProvider(mem);
          } else {
            this.toastsService.error("lbl_users_service_provider_and_organization_undefined");
          }
        },
        error => console.log(error)
      );
Run Code Online (Sandbox Code Playgroud)

memberService中的Create-Method:

  create(member: Member): Observable<any> {
    return this.http
      .post(this.RESOURCE_BASE_URL, member)
      .map(response => {
        if (response.status === 200) this.toastsSerivce.success(this.translateService.instant('lbl_users_member_created'));
        return response;
      })
      .catch(error => this.toastsSerivce.error(this.translateService.instant('lbl_users_member_create_failed')));
  }
Run Code Online (Sandbox Code Playgroud)

我甚至发现错误,但这subscribe部分似乎并不在意.它失败了success.json(),因为如果有错误,则没有json.但如果出现错误,我希望它可以调用error =>... …

angular-http angular angular-observable

21
推荐指数
1
解决办法
6万
查看次数

Angular HTTP 中的lastValueFrom 和firstValueFrom 等价吗?

在 Angular 中,我们使用 HttpClient 进行 HTTP 调用,该调用返回可观察值,如果我们想使用 Promise,我们可以使用lastValueFrom/firstValueFrom.

假设我们有:

async getLast() {
   const get$ = this.http.get(url);
   const res1 = await lastValueFrom(get$);
}
async getFirst() {
   const get$ = this.http.get(url);
   const res2 = await firstValueFrom(get$);
}
Run Code Online (Sandbox Code Playgroud)

res1 和 res2 总是相等吗?正确使用的版本是什么?

observable rxjs angular-http angular angular-httpclient

21
推荐指数
2
解决办法
2万
查看次数

Angular.js中的$ http帖子

我刚开始学习Angular.js.如何在Angular.js中重写以下代码?

var postData = "<RequestInfo> "
            + "<Event>GetPersons</Event> "         
        + "</RequestInfo>";

    var req = new XMLHttpRequest();

    req.onreadystatechange = function () {
        if (req.readyState == 4 || req.readyState == "complete") {
            if (req.status == 200) {
                console.log(req.responseText);
            }
        }
    };

    try {
        req.open('POST', 'http://samedomain.com/GetPersons', false);
        req.send(postData);
    }
    catch (e) {
        console.log(e);
    }
Run Code Online (Sandbox Code Playgroud)

这是我到目前为止所拥有的 -

function TestController($scope) {
      $scope.persons = $http({
            url: 'http://samedomain.com/GetPersons',
            method: "POST",
            data: postData,
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }).success(function (data, status, headers, config) {
                $scope.data = data; // how do …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-http

18
推荐指数
2
解决办法
10万
查看次数

AngularJS使用拦截器来处理$ http 404s - 承诺未定义错误

我有一个Angular应用程序,我想为404处理API端点.关键组件是这样的:

// app.js

var myApp = angular.module('myApp', ['ngRoute',]);

myApp.config( function ($httpProvider, $interpolateProvider, $routeProvider) {
  $httpProvider.interceptors.push('httpRequestInterceptor');

  $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/project_detail.tmpl.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: function ($route, ConcernService) {
                return ConcernService.get('projects/', $route.current.params.projectId);
            },
        }
    });
});


// interceptors.js

myApp.factory('httpRequestInterceptor', function ($q, $location) {
  return {
    response: function(response){
      return promise.then(
        function success(response) {
          return response;
        },
        function error(response) {
          if(response.status === 404){
            $location.path('/404');
            return $q.reject(response);
          }
          else{
            return $q.reject(response); 
          }
        }
      );
    }
  };
});


// services.js

myApp.factory('ConcernService', function …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-http

18
推荐指数
1
解决办法
4万
查看次数

JsonP返回"Uncaught SyntaxError:Unexpected token:"AngularJS - routingnumbers.info

我研究这个问题是一个荒谬的数字,并希望有人可以帮助诊断出错了什么.

我已经尝试过查看以下SO问题:(因为声誉,所以我不会发布超过2个链接,所以我只是包含了这些路径)

  1. 问题/ 16344933/angularjs-JSONP - 不工作/ 16352746#16352746
  2. 问题/ 19269153/JSONP请求功能于angularjs-犯规工作样的-的jQuery
  3. 问题/ 19669044/angularjs-越来越语法错误 - 在 - 返回 - JSON-从-HTTP-JSONP

在众多......

我尝试过的事情: 我已经在网址的末尾添加了&callback = JSON_CALLBACK.我更改了配置设置,例如responseType:'JSON'.我还多次重新安排了http.jsonp请求,以确保它不是编程/文本(http({})和http.jsonp)

这是我正在尝试做的事情:使用角度jsonp请求 从routingnumbers.info/api/获取信息(服务器不允许CORS).我能够使用jQuery成功地提出请求,但我无法使用angular成功.

这是相应的测试小提琴: http ://jsfiddle.net/dqcpa/14/

如您所见,我收到两个错误:

  1. 资源解释为脚本但使用MIME类型text/plain传输:" https://routingnumbers.herokuapp.com/api/data.json?rn=071000013&callback=angular.callbacks._0 ".angular.min.js:97
  2. 未捕获的SyntaxError:意外的令牌:

但是如果你检查chrome devtools中的响应 - NETWORK,它是正确的:虽然我知道jsonp会返回jsonpfunction({"MyJson":"Data"})里面的响应,这是它被挂起的地方.

这是原始代码:

//$scope.number = '071000013';
var routingApiUrl = 'https://routingnumbers.herokuapp.com/api/data.json?rn=' + $scope.number;
$http({
    method: 'jsonp',
    url: routingApiUrl + '&callback=JSON_CALLBACK',
    responseType: "json"
}).
success(function(data){
    console.log('Success: ' + data);
}).
error(function(data){
    console.log('Error: ' + data);
}); …
Run Code Online (Sandbox Code Playgroud)

jquery json jsonp angularjs angular-http

18
推荐指数
1
解决办法
6万
查看次数