0
嗨我是Angular的新手,並試圖創建一個使用Spotify API的應用程序。當我用我的搜索組件搜索卻什麼也沒有發生,我收到一條錯誤控制檯http請求上的角度ERR_CONNECTION_TIMED_OUT
GET https://api.spotfiy.com/v1/search?query=adf&offset=0&limit=20&type=artist&market=US網:: ERR_CONNECTION_TIMED_OUT
下面是該業務包含service.ts
import {Injectable} from '@angular/core';
import {Http, Headers} from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class SpotifyService{
private searchUrl:string;
constructor(private _http:Http){
}
searchMusic(str:string, type="artist"){
this.searchUrl = `https://api.spotfiy.com/v1/search?query=${str}&offset=0&limit=20&type=${type}&market=US`;
return this._http.get(this.searchUrl).map(res => res.json());
}
}
搜索組件
import { Component } from '@angular/core';
import {SpotifyService} from '../../services/spotify.service';
@Component({
moduleId: module.id,
selector: 'search',
templateUrl: 'search.component.html',
//providers:[SpotifyService]
})
export class SearchComponent{
searchStr:string;
constructor(private _spotifyService:SpotifyService){
}
searchMusic(){
this._spotifyService.searchMusic(this.searchStr).subscribe(res => {
console.log(res.artist.items);
})
}
}
app.module
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { RouterModule, Routes } from '@angular/router';
import { NavbarComponent } from './components/navbar/navbar.component';
import { AboutComponent } from './components/about/about.component';
import { SearchComponent } from './components/search/search.component';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { SpotifyService } from './services/spotify.service';
const routes: Routes = [
{ path: '', component: SearchComponent },
{ path: 'about', component: AboutComponent }
]
@NgModule({
imports: [ BrowserModule, FormsModule, HttpModule, RouterModule.forRoot(routes) ],
declarations: [ AppComponent, AboutComponent, NavbarComponent, SearchComponent ],
providers: [ SpotifyService ],
bootstrap: [ AppComponent ],
})
export class AppModule { }
haha:| |從字面上花了幾個小時! – elleven