如何在 Angular 2 中读取 JSON #text
Posted
技术标签:
【中文标题】如何在 Angular 2 中读取 JSON #text【英文标题】:How to read in Angular 2 the JSON #text 【发布时间】:2017-11-12 02:25:49 【问题描述】:抱歉,我无法在 Angular 2&4 中读取一个非常具体的 JSON 值,我可以在其中获取并显示列表的名称,但是!但我找不到在页面中显示的方法,例如在 JSON 文档中我所说的内容是这样的:(从 http://www.last.fm/api/show/artist.getTopAlbums 获得)并且我正在使用邮递员检查所有内容,我可以获得专辑的名称和其他东西,但是要获得#text来使用图像很奇怪
"topalbums":
"album": [
"name": "The Very Best of Cher",
"playcount": 1663904,
"mbid": "a7e2dad7-e733-4bee-9db1-b31e3183eaf5",
"url": "https://www.last.fm/music/Cher/The+Very+Best+of+Cher",
"artist":
"name": "Cher",
"mbid": "bfcc6d75-a6a5-4bc6-8282-47aec8531818",
"url": "https://www.last.fm/music/Cher"
,
**// +++++++++++++++++++THIS PART +++++++++++++++++++++!!!!!**
"image": [
// I'M TRYING TO USE THIS INFORMATION
"#text": "https://lastfm-img2.akamaized.net/i/u/34s/287bc1657795451399d8fadf64555e91.png",
"size": "small"
,
"#text": "https://lastfm-img2.akamaized.net/i/u/64s/287bc1657795451399d8fadf64555e91.png",
"size": "medium"
,
"#text": "https://lastfm-img2.akamaized.net/i/u/174s/287bc1657795451399d8fadf64555e91.png",
"size": "large"
,
"#text": "https://lastfm-img2.akamaized.net/i/u/300x300/287bc1657795451399d8fadf64555e91.png",
"size": "extralarge"
]
,
我想要的是获取图片的“url”,我尝试通过这种方式获取:
artist.component.html
<div *ngFor="let list of albumes">
list.name
<hr>
<!-- Can't obtain the URL... -->
<img src="list.image[1].text" >
</div>
artist.component.ts
import Component, OnInit from '@angular/core';
import ActivatedRoute from '@angular/router';
import MusicService from "../../services/music.service";
@Component(
selector: 'app-artist',
templateUrl: './artist.component.html',
providers: [MusicService]
)
export class ArtistComponent implements OnInit
constructor(private service: MusicService, private route: ActivatedRoute)
albumes: any[];
songs: any[];
ngOnInit()
this.route.params.map(params => params['mbid']).subscribe(
mbid =>
// Top Album
this.service.GetTopAlbumArtist(mbid).subscribe(topalbum =>
this.albumes = topalbum.topalbums.album;
console.log(topalbum.topalbums.image);
);
// Top Tracks
// this.service.GetTopTracksArtist(mbid).subscribe(toptracks =>
// this.songs = toptracks;
// );
)
【问题讨论】:
你试过src="list.image[0]['#text']"
或者更好的[src]="list.image[0]['#text']"
吗?
天哪,谢谢!!!!!!!!!!
【参考方案1】:
首先,如果你想得到image
的第一个位置数组,你应该访问位置0(不是1)......你也没有text
但是@ 987654323@:
要解决您的问题,您可以这样做:
src="list.image[0]['#text']"
甚至更好:
[src]="list.image[0]['#text']"
【讨论】:
以上是关于如何在 Angular 2 中读取 JSON #text的主要内容,如果未能解决你的问题,请参考以下文章
Angular 2 - 如何在打字稿中使用 FileReader 从给定的 URL 读取文件?
在 Angular2 中使用 Typescript 读取 JSON