我有api端点，它通过id，get / comments /：id返回评论，
当我在邮递员中对其进行测试时，我得到以下结果：
{
"id": 401478,
"page": 1,
"results": [
{
"author": "Gimly",
"content": "There is some decent fun to be found in _Beyond Anarchy_. It's more _Escape from LA_ than it is _Death Race 2000_, but still an entry in the franchise, which brings me to the core problem of Beyond Anarchy: Is it even really a _Death Race_ movie? The answer is yes, but to go beyond that an ask: Should it have been a _Death Race_ movie? The answer's probably no.\r\n\r\nAs I said to begin with, I had some fun with the movie, but the things that kept bringing it down were its awkward, half-hearted attatchments to the movies in the series that had gone before it. If they had have abandoned those sentiments completely, it probably would have made a better viewing experience, but then, if that had been the case, how could you call it _Death Race 4_? The opposite approach probably would have worked too, having Beyond Anarchy be an actual sequel that follows _Death Race 3_ and what came before in a way that makes sense, but then, it couldn't have been even close to the movie that we got.\r\n\r\nInstead we have _Beyond Anarchy's_ sequel-limbo status, a movie that I don't regret watching, but that also can't really work for people who are fans of the _Death Race_ franchise, or for people who have never even seen a Death Race movie.\r\n\r\n_Final rating:★★½ - Had a lot that appealed to me, didn’t quite work as a whole._",
"id": "5af426b50e0a2639430091df",
"url": "https://www.themoviedb.org/review/5af426b50e0a2639430091df"
}
],
"total_pages": 1,
"total_results": 1
}
我希望此果味显示在前端，这是我所做的
这是component.ts
constructor(private router: ActivatedRoute, private moviesService: MoviesService) {
this.movie = [];
this.review = [];
}
ngOnInit() {
this.router.params.subscribe((params) => {
// tslint:disable-next-line:prefer-const
let id = params['id'];
this.moviesService.getReview(id)
.then(review => {
console.log(review);
this.review = review;
});
});
}
}
这是service.ts
export class MoviesService {
reviewUrl = '/comments/';
private apiUrl = 'http://localhost:8000';
constructor(private http: Http, private _jsonp: Jsonp) { }
getReview(id: string): Promise<any> {
return this.http.get(this.apiUrl + this.reviewUrl + id)
.toPromise()
.then(this.handleData)
.catch(this.handleError);
}
private handleData(res: any) {
const body = res.json();
console.log(body); // for development purposes only
return body.result || body || {};
}
private handleError(error: any): Promise<any> {
console.error('An error occurred', error); // for development purposes only
return Promise.reject(error.message || error);
}
}
在组件html中，这是我所拥有的：
<div>
<h1> Comments: {{review.content}} </h1>
</div>
console.log（review）在浏览器中显示以下结果：
{id: 401478, page: 1, results: Array(1), total_pages: 1, total_results: 1}
id
:
401478
page
:
1
results
:
Array(1)
0
:
{author: "Gimly", content: "There is some decent fun to be found in _Beyond An…at appealed to me, didn’t quite work as a whole._", id: "5af426b50e0a2639430091df", url: "https://www.themoviedb.org/review/5af426b50e0a2639430091df"}
length
:
1
__proto__
:
Array(0)
total_pages
:
1
total_results
:
1
当我运行应用程序注释部分为空白时，什么都没有显示
comment:
我的代码有什么问题？我需要更改的任何帮助或建议都会有所帮助
谢谢
最佳答案
您的回复包含一个result数组，您需要像这样访问，
<h1> Comments: {{review.results[0].content}} </h1>
如果要显示所有内容，则需要使用ngFor，
<div *ngFor="let review of review.results" >
<h1> Comments: {{review.content}} </h1>
</div>