要解决Angular服务数据无法显示的问题,需要检查以下几个方面:
import { Component } from '@angular/core';
import { DataService } from './data.service';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent {
constructor(private dataService: DataService) { }
}
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class DataService {
constructor(private http: HttpClient) { }
getData() {
return this.http.get('https://example.com/data');
}
}
import { Component, OnInit } from '@angular/core';
import { DataService } from './data.service';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements OnInit {
data: any;
constructor(private dataService: DataService) { }
ngOnInit() {
this.dataService.getData().subscribe((response) => {
this.data = response;
});
}
}
{{ data }}
通过检查以上几个方面,可以解决Angular服务数据无法显示的问题。如果问题仍然存在,可以检查浏览器的开发者工具中的控制台输出,以获取更多的错误信息。