如何在Angular的另一个HTTP get方法订阅中订阅HTTP get方法？
在Angular中，可以通过使用RxJS的switchMap操作符来在一个HTTP GET方法的订阅中订阅另一个HTTP GET方法。switchMap操作符将一个Observable转换为另一个Observable，并且只会发出最新的内部Observable的值。
下面是一个示例代码：
import { HttpClient } from '@angular/common/http';
import { switchMap } from 'rxjs/operators';
// 在你的组件或服务中注入HttpClient
constructor(private http: HttpClient) {}
// 在第一个HTTP GET方法中订阅第二个HTTP GET方法
firstHttpGetMethod() {
this.http.get('first-url').pipe(
switchMap((response1: any) => {
// 在第一个HTTP GET方法的响应中获取需要的数据
const data = response1.data;
// 返回第二个HTTP GET方法的Observable
return this.http.get('second-url/' + data);
})
).subscribe((response2: any) => {
// 处理第二个HTTP GET方法的响应
console.log(response2);
});
}在上面的示例中，首先发起第一个HTTP GET请求，并在switchMap操作符中订阅第二个HTTP GET请求。在第一个HTTP GET方法的响应中获取需要的数据，并将其用于构建第二个HTTP GET请求的URL。然后，订阅第二个HTTP GET方法的响应，并在回调函数中处理响应数据。
请注意，上述示例中的URL仅作为示例，你需要根据实际情况替换为你自己的URL。
推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云函数（SCF）。
- 腾讯云云服务器（CVM）：提供可扩展的云服务器实例，适用于各种计算场景。了解更多信息，请访问腾讯云云服务器（CVM）产品介绍。
- 腾讯云函数（SCF）：无服务器计算服务，可帮助你构建和运行无需管理服务器的应用程序。了解更多信息，请访问腾讯云函数（SCF）产品介绍。
请注意，以上提到的腾讯云产品仅作为示例，你可以根据自己的需求选择适合的产品。
相关·内容
3回答
我正在尝试使用rxjs在Angular中打印http调用的结果
考虑以下代码
import { Component, Injectable, OnInit } from '@angular/core';
import { Http, HTTP_PROVIDERS } from '@angular/http';
import 'rxjs/Rx';
@Injectable()
class myHTTPService {
constructor(private http: Http) {}
configEndPoint: string =
浏览 75提问于2016-04-04得票数 85
1回答
我有一个从URL获取JSON文件的函数。现在我只需要一个随机的对象，它在那个文件中，看起来是this.data。但是，当尝试在.subscribe函数之外执行console.log(this.data)时，我得到了未定义的结果。要在函数的其余部分使用该值并将其返回给另一个函数，我需要做些什么？
下面是我的代码：
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from '
浏览 39提问于2018-07-14得票数 0
2回答
我是新手在Angular，我试图从一个网站(如google.com)获得所有的标题。这样做的目的是为了分析字段的安全性。为了做到这一点，我使用了模块HttpHeaders，但我不知道是否正确的模块来做这件事，或者也许我必须更改为另一个。我将遵循以下步骤：
import { Injectable } from '@angular/core';
import { HttpClient} from '@angular/common/http'
@Injectable({
providedIn: 'root'
})
export class H
浏览 3提问于2019-03-18得票数 0
我有一个flask应用程序在这个url数据中运行，我使用return jsonify( http://127.0.0.1:5000/SectionA ).When返回json格式的数据，我在浏览器中点击了url，如下所示 ? 我从angular应用程序的main-service.ts文件中调用这个url，如下所示 public getVamData(id,section): Observable<any> {
try {
console.log("I am here getVAM");
return
浏览 15提问于2019-01-28得票数 0
回答已采纳
我试图从http.get()中获取值，并将其赋值给局部变量。
这是我的密码。UserName.ts
import { Http } from '@angular/http';
this.http.get('http://localhost:8000/user/').subscribe(res => {
this.username$ = res;
console.log(this.username$)}) //working
console.log(this.username$)
我将未定义的作为输出
http调用- 将只返回一个用户名。我必
浏览 4提问于2017-12-18得票数 3
回答已采纳
当我使用post时，没有错误，但是post方法不工作this.http.post。(它昨天起作用了，但今天不起作用。)不知道)有我的服务：
import { Injectable } from '@angular/core';
import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';
import {Observable} from 'rxjs/Observable';
import {GetData} from './data';
impo
浏览 0提问于2018-03-10得票数 1
回答已采纳
Angular版本8.0.4 如何从返回angular中可观察类型T的数组的泛型方法中获取数据？这是我写的函数 获取数据的泛型方法 public getData<T> (path: string): Observable<T[]> {
return this.http.get(this.baseUrl + path).subscribe();
// return this.data;
// var ddd: T[];
// return this.http.get<Observable<T[]
浏览 37提问于2019-06-26得票数 0
我在下面的代码中遇到了一个错误，我想知道是什么做错了。我试图从REST中获取数据并接收此错误。
代码：
import {Injectable} from "@angular/core";
//import {POSTS} from "./mock-posts";
import { Http, Headers,RequestOptions } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
exp
浏览 4提问于2016-12-01得票数 2
1回答
下面的不会将输出数组用于控制台。范围不正确？
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Broker } from './broker';
@Injectable()
export class BrokerSurveyService {
brokers: Broker[] = [];
constructor(private http: HttpClient) {
浏览 1提问于2018-04-10得票数 3
回答已采纳
1回答
我是Angular 2的初学者，我有一些问题：
Q#1我有一个方法(放在组件中)，例如"Get“。它返回包含字符串数组的Observable。在这个方法中，我使用了angular的HTTP模块，它将get请求发送到后端：
this.http.get("some_URL").map(resp =><Array<string>>resp.json()).subscribe(items =>{
this.items = items; //private component's variable
this.subjec
浏览 3提问于2017-07-27得票数 0
回答已采纳
我试图以这样的角度将数据从一个组件发送到另一个组件。
onSubmit(form: NgForm){
this.newsService.searchNews(form.value.query).subscribe((res:any) => {
this.newsService.searchedNews.next(res.articles);
});
}
我将搜索的新闻从我的搜索组件发送到我的主组件，如果我在我的主组件中订阅ngOnInit中的主题，数据将是null，因为方法还没有被调用，或者用户还没有搜索任何东西，所以我的问题是，当这个方法在我的HomeCom
浏览 3提问于2021-09-28得票数 1
回答已采纳
我正在尝试在angular应用程序中使用'angular-modal- gallery‘制作图片库。问题是我不知道如何将可观察对象(带有图像数据)从媒体服务转换为数组。Angular-modal-gallery文档说我需要用我的图像初始化数组。
media.service.ts
export class MediaService {
API_URL = AppConfig.settings.api.url;
constructor(private http: HttpClient) { }
getAlbum = (id: string) => {
retu
浏览 0提问于2019-03-01得票数 1
3回答
来自Angular1x背景，我正在将我现有的应用程序迁移到Angular4
这就是我的ng4服务的样子
import { Injectable } from '@angular/core';
import {Http} from '@angular/http';
@Injectable()
export class DataService {
private _http : Http;
constructor(http:Http) {
this._http = http;
}
public GetPosts() : any{
this._htt
浏览 4提问于2017-11-30得票数 0
我有一个DataService。
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
@Injectable()
export class DataService {
constructor(private http: Http) {}
getData(): Promise<any[]> {
return this.http.get('/api/data')
.toPromise()
浏览 0提问于2017-09-11得票数 2
回答已采纳
我正在尝试使用服务获取JSON数据的角度，并使用HttpClient使用get()方法获取数据。问题是，我使用的是诺言，函数返回的是一个包含它的值的承诺。
我在控制台中打印了值，它正在返回：
ZoneAwarePromise {__zone_symbol__state: null，__zone_symbol__value: Array(0)}控件：(22) [{…]}，{…}，{…}，{…}，{…}，{…}，{…}，}
以下是服务代码：
import { Injectable } from '@angular/core';
import { HttpClient
浏览 8提问于2022-06-23得票数 0
回答已采纳
4回答
在角2v2.0.1中，onInit被调用两次。(很明显，当它被调用一次时，我也做了一些错误的事情，但这不是现在的问题)
这是我的柱塞：
以下是服务代码：
import {Injectable} from '@angular/core';
import {Http, Response} from '@angular/http';
import {Observable} from 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do
浏览 2提问于2016-12-08得票数 19
回答已采纳
5回答
我试图利用angular2中的可观察性，并对为什么要使用map()而不是subscribe()感到困惑。假设我从一个webApi获得值，如下所示
this.http.get('http://172.17.40.41:8089/api/Master/GetAllCountry')
现在，使用subscribe(success, error, complete)，我可以获得成功回调的所有值，也可以返回完整回调的值。如果我可以完成所有这些功能，那么map()的需求是什么？它有什么优势吗？
简单地说，为什么要像这样写
this.http.get('http://172.17
浏览 6提问于2017-02-20得票数 67
回答已采纳
1回答
我有一个显示信息的表，单击表行后，用户可以在完成请求后更新该值，该表不使用新值更新，我必须执行F5来刷新视图。
如何在完成请求后强制执行新的get请求
这是相关代码
我的服务
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import {Observable} from 'rxjs/Rx';
import { BehaviorSubject } from 'rxjs/BehaviorSubject
浏览 2提问于2017-05-01得票数 5
回答已采纳
2回答
亲爱的，
我被困住了，我遵循了关于http.get和可观察的简单http.get教程，但是我无法在视图中呈现数据。
我的服务：
import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Observable } from "rxjs";
import { map } from "rxjs/operators";
const baseUrl = "http://localho
浏览 5提问于2020-05-17得票数 0
回答已采纳
3回答
在早期的角度版本中，在我们的服务中，我们可以简单地将响应映射到JSON对象，如下所示：
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
import { HttpClient } from '@angular/common/http';
@Injectable()
export class MakeService {
constructor(private http:HttpClient) { }
getMakes(){
r
浏览 2提问于2018-03-12得票数 0
回答已采纳
我是Angular2的新手。我有一个LoginComponent，它通过提交按钮执行一个名为submitLogin的操作。单击后，它将发送用户名和密码(通过UserService)到API服务器(借助UtilService)。如果服务器响应OK，它将返回一个令牌，我们将在本地保存它并重定向它。
到目前为止，我已经成功地发送用户名和密码并保存令牌。但是，我对如何在LoginComponent中添加另一个操作以重定向用户感到困惑。(我在下面的login.component.ts中添加了一条评论，以澄清我想做什么)。
如果我没有说清楚的话，可以让我知道。
以下是我的密码：
login.compone
浏览 2提问于2016-01-09得票数 0
回答已采纳
1回答
在tns调试期间没有请求
、、、、
这是我在本地语言和移动开发环境中的第一个应用程序。我遇到了一些困难。我尝试的是一些虚拟http请求与角http模块，但出于某种原因，当我调试应用程序的铬，似乎没有提出任何要求。
这是我的代码：
模板：
<Page>
<StackLayout>
<Button text="GET" (tap)="get()"></Button>
<Button text="POST" (tap)="post()"></Button>
浏览 0提问于2018-06-27得票数 1
回答已采纳
我正在使用如下所示的技术开发一个应用程序。我有一个名为"test.page.ts“的打字文件，里面有一个变量"response: any"；我必须在另一个名为"test2.page.html”的打字文件中重用它，称之为{{response.name}}。我该怎么做呢？谢谢。 我目前使用的技术： Ionic 4.10.2
Angular 6
8.1.2 (cordova-lib@8.1.1)
TypeScript
Visual Studio Code test.page.ts import { Component, OnInit } from '@a
浏览 15提问于2019-02-26得票数 1
1回答
角与节点JS之间的通信
、、、
我有一个具有类型记录的项目，在该项目中，我试图使用服务创建它们之间的通信。
当从前面发出get()请求时，我不能从后面得到任何东西，我不知道可能缺少什么来配置，也不知道服务中有什么问题。
这是API响应：
这是service.ts：
import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
@Injectable({
providedIn: 'root'
})
export class Dashbo
浏览 1提问于2022-06-20得票数 -1
我正在尝试设计一个带有后端服务器的API，该服务器接收来自客户端的调用。我对使用类型记录非常陌生(我来自Java背景)。我收到一个错误，说明“没有重载匹配此调用”。
我创建了将在这个文件中调用的服务的基础：
//create functions that can reach backend by making http requests using httpclient
import { Injectable } from '@angular/core';
import {HttpClient} from '@angular/common/http';
imp
浏览 2提问于2021-05-14得票数 1
回答已采纳
我知道如何使用模拟后端以及promises来测试http。尽管我正在努力寻找一个解决方案来测试promise中的http方法。任何建议都将不胜感激。下面是包含promise中带有http方法的函数的函数：
import { Injectable } from '@angular/core';
import { AbstractControl, FormGroup, FormControl, ValidatorFn, AsyncValidatorFn } from '@angular/forms';
import { Headers, RequestOptions
浏览 0提问于2018-01-31得票数 0
1回答
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
// Import RxJs required methods
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch'
@I
浏览 0提问于2016-11-22得票数 1
回答已采纳
3回答
所以在普通的javascript中，如果我想给一个变量赋值，然后在函数之外使用这个值，那么首先声明变量，然后在函数中定义它的值。我对打字稿和棱镜都很陌生，所以我不知道该怎么做。
在下面的代码中，我试图从服务中的方法中获取值，然后将该值传递给我的返回。(我希望这是有意义的)。但是，我在console.log(url)上一直没有定义，没有其他错误。
emailsAPI() {
let url: any
this.apiUrlsService.urlsAPI().subscribe(
data => {
this.results =
浏览 0提问于2017-12-03得票数 1
回答已采纳
我刚刚开始使用Angular 7，我正在尝试调用另一个域上的API。为此，我已经将所有需要的头添加到API的响应中。似乎我不再收到CORS错误。但我也不了解我的通话结果。以下是一些相关代码: API： getUser() {
return this.http.get<User[]>('http://localhost:98/user/settings/getuser');
} 接口调用： test() {
this.userService.getUser().pipe(first()).subscribe(u
浏览 10提问于2019-06-29得票数 0
回答已采纳
我在ION3上使用angular 4.3中的HttpClientModule。我的应用程序与Django服务器通信，该服务器请求由拦截器发送的身份验证头。我面临的问题是，当我请求HttpClientModule执行get请求时，它会发送两个请求。一个具有未响应的身份验证头，另一个没有身份验证头。有谁可以帮我？我不知道我做错了什么：
下面是我在Web Inspector中看到的内容：
这是我的提供者：
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Injectabl
浏览 0提问于2018-06-16得票数 0
我正在尝试执行一个从本地目录获取文件的http.get请求，此时我只想console.log api get被请求的响应。getFile()显示了console.log，但调用了http，不确定http在angular2中是如何使用的；我知道在angular1中它使用.then作为响应。
import { Http, HTTP_PROVIDERS } from '@angular/http';
getFile() {
this.http.get('//localhost:1337/getFile');
console.log('get me t
浏览 0提问于2016-07-28得票数 2
1回答
我简化了以下服务代码，以便在这里发布
Load(Channel: any) {
//
let URL = Globals.AppSiteRoot + Channel.URL
return this.LoadData(URL)
}
Load_Default() {
let URL = Globals.AppSiteRoot + "dir1/somedata.XML"
console.log("XYZService.Load_Default------.------&
浏览 3提问于2020-03-17得票数 0
回答已采纳
1回答
我花了几个小时尝试不同的方法，让这个观察物在离子/角度下工作。我已经尝试了不同的设置和接口来插件到Observable，它的属性是字符串。我尝试过将JSON作为接口插入。我只需要使用额外的参数来获取https服务器。我一直收到错误，指出返回的http基本上不能正确地类型化为getGP中定义的observable。错误是 ? 当删除订阅时，当JSON不用作接口时，我得到几乎相同的错误。一个简单的GET/POST在vanilla中很容易实现，而angular让我抓狂。我还需要将响应保存在一个变量中，并将数据注入另一个模块。我已经看过了rxjs文档，不知所措。如果能帮上忙，我们将不胜感激。我正在运
浏览 9提问于2019-08-25得票数 0
回答已采纳
简单地问一下，我是否需要取消订阅这里包含的订阅，因为它不在构造函数中？
import { Component, OnInit } from '@angular/core';
import { HttpService } from "./services/http.service";
import { Main } from "./interfaces/data-interface";
@Component({
selector: 'app-root',
templateUrl: './app.component.
浏览 7提问于2022-02-14得票数 1
回答已采纳
我正在尝试从数据库表中删除一条记录，在前端使用Angular，在后端使用PHP。我正在通过URL传递id，并试图用$_GET['id']将其取回，但它不起作用(控制台中没有错误)。
PHP API：
<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");
header("Access-Control-Allow-Methods: DELETE");
header("
浏览 13提问于2018-02-08得票数 1
回答已采纳
下面是my Service类，它接受具有json格式数据的url。
service.ts
import { Injectable } from "@angular/core";
import { Http } from '@angular/http';
import { Observable } from "rxjs/Observable";
@Injectable()
export class Service {
public http: string;
constructor(p
浏览 3提问于2017-07-22得票数 3
2回答
我正在学习全堆栈Angular4，并想知道如何才能从一个组件的get调用获得数据到另一个组件，这样我就可以用{data.name}将数据中继到html页面？
我尝试将组件导入到另一个组件中，然后将一个空对象设置到保存数据的component.data中，但我得到一个空对象作为响应。
我做错了什么？
更新：
我的共同服务：
import {Injectable} from "@angular/core";
import {Http, Response, Headers, RequestOptions} from "@angular/http";
import {O
浏览 4提问于2017-11-19得票数 9
回答已采纳
我在从asp.net检索数据时遇到了问题。我试着把所有的预订餐厅预订数据显示在控制台上。它只在控制台上显示未定义的内容。
下面是从asp.net核心获取数据的服务代码
import { Booking } from './../_models/booking';
import { environment } from 'src/environments/environment';
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } fro
浏览 5提问于2020-08-07得票数 0
2回答
您能告诉我如何在角2中调用http调用并使用ng-重复显示数据吗？
这是我的代码
import {Component,View} from 'angular2/core';
import {Http, HTTP_PROVIDERS} from 'angular2/http';
import {Router} from 'angular2/router';
@Component({
templateUrl: 'home/home.html'
})
export class AppComponent {
toDo
浏览 3提问于2016-02-11得票数 0
回答已采纳
1回答
我有一些“卡片”，我想为它们获取关于一个角度服务的信息，问题是我在API上使用http请求获得这些信息，并且我希望在所有请求完成后返回。
cards.component.ts
import {Component} from '@angular/core';
import {CardsService} from './cards.service';
import 'easy-pie-chart/dist/jquery.easypiechart.js';
@Component({
selector: 'cards',
t
浏览 1提问于2018-05-17得票数 0
回答已采纳
2回答
我想做一个待办事项列表，我有两个组件(稍后还有更多)，我将共享一个Tache数组。
Navbar组件
import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { Tache } from './tache';
import { TacheService } from './tache.service';
import { InMemoryDataService } from './en-memo
浏览 2提问于2017-04-22得票数 1
回答已采纳
我是Angular2的新手，我正在努力将从http.get()返回的数据显示在我的html中。我已经将问题缩小到对我的api的一个api的get()调用，如果我使用另一个api端点，数据在html中显示没有问题。我知道我的应用程序接口正在检索数据，因为当我对数据执行console.log()操作时，预期的输出就在那里。
服务
//color.service.ts
import { Injectable } from '@angular/core'
import { Observable } from 'rxjs/RX'
import { Http, Respon
浏览 7提问于2017-08-13得票数 0
回答已采纳
2回答
我是新来的角场！到目前为止，我一直喜欢这种情况，但在接下来的情况下会遇到一些困难。我想在用户单击数据表中带有href标记的特定单元后，将数据从一个组件发送到另一个组件。因此，我创建了以下.ts文件
service.ts
import { Injectable } from '@angular/core';
import { HttpClient,HttpErrorResponse } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
im
浏览 0提问于2019-02-16得票数 2
回答已采纳
我在一个项目中工作，在这个项目中，我希望有JSON文件资产文件夹。我创建服务和组件。1- assets文件夹中的我的JSON文件
data.json
[
{
"Date" : "10/09/2017",
"ID" : "1",
"Color" : "Orange",
}, {
"Date" : "10/11/2017",
"ID" : "2",
"Color" :
浏览 15提问于2018-01-10得票数 0
回答已采纳
1回答
我想创建一个列表，但当读取Json时出现此错误，我该如何修复它？
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
/*
Generated class for the KpisProvider provider.
See https://angu
浏览 0提问于2017-07-26得票数 1
1回答
我创建了一个服务，它的主题名为selectedNode。当我给出加载页面的直接URL时，我试图更新subject的值。问题是，当我试图在传递时直接更新该值时，不会更新的值。
例如，如果我打开URL localhost:4200/blog/page/subpage，它应该用值page/subpage更新selectedNode。但是，事实并非如此。
我的代码如下：
blog.component.ts
import {Component, OnInit} from '@angular/core';
import {BlogService} from '../../serv
浏览 0提问于2019-03-17得票数 1
回答已采纳
2回答
我尝试从一个服务订阅，它构建没有错误，但我得到错误"this.myService.getAll不是一个函数“时，在浏览器中查看。
服务：
import { Injectable } from '@angular/core';
import { Http } from "@angular/http";
@Injectable()
export class MyServiceService {
url:string;
constructor(private http:Http) {
this.url = "http://12
浏览 0提问于2018-03-17得票数 1
回答已采纳
我有一个角度服务，这是用来作为中间点，从数据库获取数据。这就是它：
export class WebService {
constructor(private http: Http, private datePipe: DatePipe) {
this.getStatsbyDate(this.datePipe.transform(new Date(), 'dd-MM-yyyy'));
}
statsModel = {
date: this.datePipe.transform(new Date(), 'dd-MM-yyyy'),
answ
浏览 22提问于2018-03-03得票数 0
回答已采纳
我有一项服务需要测试：
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
@Injectable()
export class LoginService {
private baseUrl: string = 'http://localhost:4000/';
constructor (private http: Http) {}
public getBaseUrl() {
return this.base
浏览 2提问于2016-07-22得票数 3
回答已采纳
我正在打电话给一个休息服务公司，我正在做这样的事情。所有HTTP请求的基类：
import { Injector } from '@angular/core';
import 'rxjs/add/operator/map';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import {Observable} from 'rxjs/Rx';
export class HttpRoot {
浏览 2提问于2017-06-03得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
