我是angular的新手,我从头开始构建这个系统.我编写了以下方法来将GET请求发送到后台的端点.该方法在ngOnInit方法中调用.

    public getExistingDrp():Observable<any>{
    const url = "http://localhost:2252/api/mldetails/mldropdown?AgID=49&CID=37&intExist=0";
    const token = "test-token";
    const headers = new HttpHeaders(
      {
        'Authorization': 'Bearer ' + token
      }
    );
    return this.http.get(url ,{headers: headers})
  }

呼叫未到达后台.我已向后台方法添加了断点,当我从postman 发送请求时,它们会被击中.但这个应用程序没有发生任何事情,甚至没有出现错误.浏览器的"网络"选项卡中也没有显示任何内容.控制台给出以下输出.

    _Observable {
  source: _Observable {
    source: _Observable {
      source: [_Observable],
      operator: [Function (anonymous)]
    },
    operator: [Function (anonymous)]
  },
  operator: [Function (anonymous)]
}

我的app. modules.ts如下

    import { NgModule } from '@angular/core';
import {
  BrowserModule,
  provideClientHydration,
} from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { NavbarComponent } from './components/navbar/navbar.component';
import { SidebarComponent } from './components/sidebar/sidebar.component';
import { TransferMLOComponent } from './pages/transfer-mlo/transfer-mlo.component';
import { MLOcomponentsComponent } from './pages/existing-mlodetails/allMLOdetails/mlocomponents/mlocomponents.component';
import { MLOdetailsNavbarComponent } from './pages/existing-mlodetails/mlodetails-navbar/mlodetails-navbar.component';
import { MLOtarrifComponent } from './pages/existing-mlodetails/allMLOdetails/mlotarrif/mlotarrif.component';
import { MLOlocationsComponent } from './pages/existing-mlodetails/allMLOdetails/mlolocations/mlolocations.component';
import { MLOdamagesComponent } from './pages/existing-mlodetails/allMLOdetails/mlodamages/mlodamages.component';
import { MLOrepairComponent } from './pages/existing-mlodetails/allMLOdetails/mlorepair/mlorepair.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { provideHttpClient, withFetch, HttpClientModule } from '@angular/common/http';

@NgModule({
  declarations: [
    AppComponent,
    NavbarComponent,
    SidebarComponent,
    TransferMLOComponent,
    MLOcomponentsComponent,
    MLOdetailsNavbarComponent,
    MLOtarrifComponent,
    MLOlocationsComponent,
    MLOdamagesComponent,
    MLOrepairComponent,
  ],
  imports: [BrowserModule, AppRoutingModule, NgbModule, HttpClientModule],
  providers: [provideClientHydration(), provideHttpClient(withFetch())],
  bootstrap: [AppComponent],
})
export class AppModule {}

我错过了什么吗?我做错了什么吗?

推荐答案

getExistingDrp返回Observable.要执行HTTP请求,您只需调用subscribe方法,如下所示:

ngOnInit() {
  this.getExistingDrp().subscribe();
}

更多信息- https://angular.io/guide/http-request-data-from-server#starting-the-request

Angular相关问答推荐

元件不工作时的Angular 17属性 Select 器

仅在展示时使用垫式步进器

为什么在回调完成之前,可观察对象会返回?

Angular 16-错误NG8002:无法绑定到NGModel,因为它不是输入的已知属性

Angular 应用程序未在Azure应用程序服务中运行

将ngModel绑定到@Input属性是不是一种糟糕的做法?

一次重定向后,所有子路由都处于活动状态

无法创建新的 Ionic 项目

无法绑定到formControl,因为它不是input的已知属性

大型 Angular 12 应用程序 - 我如何管理 js 文件

PrimeNG:如何以编程方式更改分页器中的选定页面?

Angular:为什么在我的自定义 ErrorHandler 中订阅主题不触发?

如何以Angular 显示动态视图模型

Angular:显示带有嵌套子项的内容投影

模块AppModule导入的意外指令LoginComponent,请添加@NgModule 注释

在 Ionic 2 中使用 NodeJS.Timer 时找不到命名空间 NodeJS

使用 Angular 2 新路由更改页面标题

Angular 6在输入键上添加输入

如何处理Angular2中的查询参数

Angular2:将数组转换为 Observable