我正在Angular 7项目中开发风险游戏。 为了创建世界地图,我创建了一个本地JSON文件,该文件在Angular代码中调用。
JSON如下:
["bord", {
"continent": [
{
"land": [
{
"naam":["Ukraine"],
"points": [[
[1561,236],
[1561,239],
我做了一个BordService,在这里尝试使用HTTPClient在本地访问JSON文件,例如:
import { HttpClient } from '@angular/common/http';
import {Observable} from 'rxjs';
import { Injectable } from '@angular/core';
import { Landen } from '../model/landen';
@Injectable({
providedIn: 'root'
})
export class BordService {
constructor(private http: HttpClient) {
}
getJSON(): Observable <Landen> {
return this.http.get<Landen>('./assets/json/landen.json');
}
}
我在类似这样的组件中订阅它:
ngOnInit() {
this.BordService.getJSON().subscribe(data => {
this.Land = data["Landen"];
})
在我的HTML中,我要求在JSON中定义的值如下:
<svg>
<polygon *ngFor="let Land of Landen"
id={{Landen.continent }}
class= {{Landen.naam }}
points={{ Landen.points }}/>
</svg>
但是我似乎仍然无法在屏幕上显示地图。
我们将不胜感激!