Question

您好，我是angular的新手，我无法弄清楚下面的组件中显示html响应数据是我的代码，请有人帮忙。谢谢

data.Service.ts （这里我称为返回一些html的API服务）

getLibrary() {return this.http.get('http://localhost:8000/api/user/library');}

Library.component.ts

import { Component, OnInit } from '@angular/core';
import { DataService } from '../data.service';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-library',
  templateUrl: './library.component.html',
  styleUrls: ['./library.component.scss']
})
export class LibraryComponent implements OnInit {

  library: any;

  constructor(private data: DataService) { }

  ngOnInit() {
    this.data.getLibrary().subscribe(
      data => this.library = data 

    );



  }

}

Library.component.html

{{library}}

错误

core.js:14576 ERROR 
HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost:8000/api/user/library", ok: false, …}
error: {error: SyntaxError: Unexpected token < in JSON at position 0 at JSON.parse (<anonymous>) at XMLHttp…, text: "<div style="display:block" class="libContainer lib…            
↵           </div>
↵
↵
↵</div>
↵
↵
↵
↵
↵
↵
↵
↵
↵"}
headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit: ƒ}
message: "Http failure during parsing for http://localhost:8000/api/user/library"
name: "HttpErrorResponse"
ok: false
status: 200
statusText: "OK"
url: "http://localhost:8000/api/user/library"
__proto__: HttpResponseBase

Answer 1

返回的数据类型是可以像这样使用的文本

 ngOnInit() {
        this.data.getLibrary().subscribe(
          (data:(any)) => this.library = data 

        );

可见

<div [innerHTML]="library"></div>

Angular将HTML响应数据显示到视图中

1 个答案: