http请求

1.在app.module.ts中配置

//Angular 的核心模块
import { NgModule } from '@angular/core';
// 浏览器解析模块
import { BrowserModule } from '@angular/platform-browser';
// App组件
import { AppComponent } from './app.component';
// http请求
import {HttpClientModule} from '@angular/common/http'
@NgModule({
  // 配置（声明）当前项目运行依赖的组件
  declarations: [
    AppComponent
  ],
  // 配置当前项目运行依赖的其他模块
  imports: [
    BrowserModule,
    HttpClientModule
  ],
  // 配置项目所需要的服务
  providers: [],
  // 指定应用的主视图
  bootstrap: [AppComponent]
})
// 通过导出AppModule这个模块，来启动应用
export class AppModule { }

2.在app.component.ts中配置

import { Component } from '@angular/core';
import {HttpClient} from '@angular/common/http'
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'my-app';
  lists:Array<number> = [1,2,3];
  constructor(public http:HttpClient){}
  handleClick():void{
    console.log(this.title)
    this.title = "change"
  }
  // 组件初始化的时候触发
  ngOnInit(){
    console.log("init")
  }
}

  ngOnInit(){
    var url:string = "http://localhost:8000/top250";
    this.http.get(url).subscribe(res=>{
      console.log(res)
    })
  }