http.get() 传递 ID
http.get() passing ID
我正在尝试通过打字稿中的 http.get() 从 URL 调用中获取详细信息。我的 URL 检索此详细信息的端点是一种 localhost:8001\character34567890
,其中数字是字符的 ID。
如果我在浏览器上测试,URL returns 正确所有数据。
我的问题是打字稿函数调用。 Fron HTML 前面,我将函数调用为:
<a href="#{{character.id}}" (click)="characterDetail(character.id)">Read more</a>
那么,剩下的函数就是这些:
characterDetail(characterId: number) {
this.asyncCharDetail = this.getCharacterDetail(characterId)
.do(res => {
console.log(res);
})
.map(res => res.results);
}
getCharacterDetail(characterId: number) {
return this.http.get(this.characterDetailApiUrl + characterId,{})
.map((res: Response) => res.json())
}
第一个函数的 console.log(res)
不打印任何内容。 characterId
和 url 都是正确的,但不知道检索不到字符详细信息的原因。
数据检索的第二部分显示在模态上window。
编辑:这里有更多代码:
private characterDetailApiUrl = 'http://localhost:8001/character/';
....
//To save the character details from Http get.
asyncCharDetail: Observable<string[]>;
characterDetail(characterId: number) {
console.log('Character detail for ID ' + characterId);
this.loading = true;
this.asyncCharDetail = this.getCharacterDetail(characterId)
.do(res => {
console.log(res);
this.loading = false;
})
.map(res => res.results);
console.log(this.asyncCharDetail);
}
getCharacterDetail(characterId: number) {
return this.http.get(this.characterDetailApiUrl + characterId )
.map((res: Response) => res.json());
}
上Html前档:
<a href="" (click)="characterDetail(character.id); $event.preventDefault()">Read more</a>
return this.http.get(this.characterDetailApiUrl + characterId,{})
只有 URL 应该没问题。你能检查一下你删除 ,{}
后得到了什么吗?所以 return this.http.get(this.characterDetailApiUrl + characterId)
如果您需要完整的回复,请尝试将 {}
替换为 { observe: 'response' }
您必须订阅 Observable 才能执行某些操作。
characterDetail(characterId: number) {
this.getCharacterDetail(characterId)
.do(res => {
console.log(res);
})
.map(res => res.results)
.subscribe(data => {
//...do something with data
});
}
我已将函数从 2 更改为 1,现在我从角色中获得了一些数据。现在按照@CornelC 的建议工作
getCharacterDetail(characterId: number) {
return this.http.get(this.characterDetailApiUrl + characterId)
.subscribe(res =>
console.log(res.json())
);
}
现在我从前端调用该函数,但需要显示一个模式 window 和检索到的数据
我正在尝试通过打字稿中的 http.get() 从 URL 调用中获取详细信息。我的 URL 检索此详细信息的端点是一种 localhost:8001\character34567890
,其中数字是字符的 ID。
如果我在浏览器上测试,URL returns 正确所有数据。
我的问题是打字稿函数调用。 Fron HTML 前面,我将函数调用为:
<a href="#{{character.id}}" (click)="characterDetail(character.id)">Read more</a>
那么,剩下的函数就是这些:
characterDetail(characterId: number) {
this.asyncCharDetail = this.getCharacterDetail(characterId)
.do(res => {
console.log(res);
})
.map(res => res.results);
}
getCharacterDetail(characterId: number) {
return this.http.get(this.characterDetailApiUrl + characterId,{})
.map((res: Response) => res.json())
}
第一个函数的 console.log(res)
不打印任何内容。 characterId
和 url 都是正确的,但不知道检索不到字符详细信息的原因。
数据检索的第二部分显示在模态上window。
编辑:这里有更多代码:
private characterDetailApiUrl = 'http://localhost:8001/character/';
....
//To save the character details from Http get.
asyncCharDetail: Observable<string[]>;
characterDetail(characterId: number) {
console.log('Character detail for ID ' + characterId);
this.loading = true;
this.asyncCharDetail = this.getCharacterDetail(characterId)
.do(res => {
console.log(res);
this.loading = false;
})
.map(res => res.results);
console.log(this.asyncCharDetail);
}
getCharacterDetail(characterId: number) {
return this.http.get(this.characterDetailApiUrl + characterId )
.map((res: Response) => res.json());
}
上Html前档:
<a href="" (click)="characterDetail(character.id); $event.preventDefault()">Read more</a>
return this.http.get(this.characterDetailApiUrl + characterId,{})
只有 URL 应该没问题。你能检查一下你删除 ,{}
后得到了什么吗?所以 return this.http.get(this.characterDetailApiUrl + characterId)
如果您需要完整的回复,请尝试将 {}
替换为 { observe: 'response' }
您必须订阅 Observable 才能执行某些操作。
characterDetail(characterId: number) {
this.getCharacterDetail(characterId)
.do(res => {
console.log(res);
})
.map(res => res.results)
.subscribe(data => {
//...do something with data
});
}
我已将函数从 2 更改为 1,现在我从角色中获得了一些数据。现在按照@CornelC 的建议工作
getCharacterDetail(characterId: number) {
return this.http.get(this.characterDetailApiUrl + characterId)
.subscribe(res =>
console.log(res.json())
);
}
现在我从前端调用该函数,但需要显示一个模式 window 和检索到的数据