我正在尝试将来自服务器的图像显示为base64字符串.http和服务器的详细信息对我的问题并不重要(基本上,它可以工作).我有这个代码不起作用; 即我看到组件中的所有数据,但屏幕上没有显示图像.
服务:
import { Injectable } from 'angular2/core'
import {Observable} from 'rxjs/Observable';
@Injectable()
export class ImageService {
constructor() {
}
public getImage(): Observable<string> {
return Observable.create(imageData);
}
}
const imageData: string = "iVBORw0KGgoAAAANSUhE...";
Run Code Online (Sandbox Code Playgroud)
组件:
import { Component } from 'angular2/core';
import { ImageService } from './service'
@Component({
selector: 'my-app',
template: '<div><img [src]="data:image/PNG;base64,{{imageContent}}"> </div>',
providers: [ImageService]
})
export class AppComponent {
private imageContent: string = "";
constructor(imageService: ImageService) {
imageService.getImage().subscribe(response => {
this.imageContent = response;
});
}
}
Run Code Online (Sandbox Code Playgroud)
如前所述,代码不起作用.我得到的不是支持屏幕上的图像:评价不支持报价!
我会很感激这个简单问题的一个有效例子.