angular2與寧靜的服務

我正在嘗試使用我的Angular2應用程序進行RESTful服務。當我給當地的json網址(/app/config.json)時它正在工作。但是當我嘗試使用下面的url時，它不起作用。angular2與寧靜的服務

網址：http://localhost:8082/RESTful_Jersey_JSON/rest/json/metallica/get

上面的網址將返回如下JSON值，

{ 
    "title": "SingerName", 
    "singer": "Singer123", 
    "id": "1", 
    "name": "Hero123" 
}

app.module

@NgModule({ 
    declarations: [ AppComponent,HeroListComponent,HeroDetailComponent],   
    imports: [BrowserModule,HttpModule,routing], bootstrap: [AppComponent] 
})

HeroService.ts

getHeroes(){ 
    var headers = new Headers({ 'Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 
    return this._http.request("localhost:8082/RESTful_Jersey_JSON/rest/‌json/metallica/…) .map((res:Response) => res.json()); 
}

HeroListComponent

@Component({ 
    selector: 'my-hero-detail', 
    template: ` 
     <h2>Hero List Component</h2> 
     <ul *ngFor="let hero of heroes"> 
     {{hero}} 
     <li>{{hero.id}}</li> 
     <li>{{hero.name}}</li> 
    </ul>` 
}) 
export class HeroListComponent implements OnInit { 
    heroes = []; 

    constructor(private _heroService:HeroService) {} 

    ngOnInit(){  
    this._heroService.getHeroes(). 
     .subscribe(response =>this.heroes = response);  
     }  
    }

來源

2017-03-29 Santhoshkumar

您不能在休息請求中輸入相關路徑。 – echonax

如果您直接在瀏覽器中打開它，其他鏈接是否有效？ –

是的，其他鏈接在瀏覽器/郵遞員客戶端中工作。 – Santhoshkumar

如果什麼返回是：

{ "title": "SingerName", "singer": "Singer123", "id": "1", "name": "Hero123" }

這意味着這是一個對象，而不是一個數組喲你可以遍歷你的模板。

所以，也許改變的變量名稱只是英雄，因爲它是一個對象，而不是一個數組，但是這只是一個細節;）在這裏，我將使用heroes雖然：

ngOnInit(){  
    this._heroService.getHeroes(). 
    subscribe(response => this.heroes = response);  
}

那麼你不需要遍歷的反應，只是顯示它像這樣：

<div> 
    {{heroes?.id}} 
    {{heroes?.name}} 
</div>

，並使用安全的導航操作:)

希望這有助於它是有用的！

來源

2017-03-29 14:26:40 Alex

謝謝。它正在與安全導航運營商

合作。 – Santhoshkumar

非常歡迎！是的，安全的導航運營商在異步的角度世界中是一件美妙的事情：D祝您有個愉快的夜晚和愉快的編碼！ :) – Alex

爲echonax說不要使用相對路徑，並設置標題是這樣的：

let options = new RequestOptions({ headers: headers }); 

return this._http.get("/assets/herolist.json", options).map((res:Response) => res.json());

來源

2017-03-29 12:04:37

謝謝Bougarfaoui。 /assets/herolist.json已經在工作。我需要連接REST服務，如'http：// localhost：8082/RESTful_Jersey_JSON/rest/json/metallica/get'。 – Santhoshkumar

angular2與寧靜的服務

回答

相關問題