主页 / user-24538254

user24538254's questions

Martin Hope
user24538254
Asked: 2025-04-04 16:31:50 +0800 CST
  • 6

我正在尝试按照本教程（https://maplibre.org/ngx-maplibre-gl/API/）在 Angular 应用程序中实现 MapLibre GL，但无法成功。

我不知道如何从教程中实现此代码：

import { Component } from '@angular/core';
import { MapComponent } from '@maplibre/ngx-maplibre-gl';

@NgModule({
  template: `
    <mgl-map
      [style]="'https://demotiles.maplibre.org/style.json'"
      [zoom]="[9]"
      [center]="[-74.5, 40]"
    >
    </mgl-map>
  `,
  styles: [
    `
      mgl-map {
        height: 100%;
        width: 100%;
      }
    `,
  ],
  imports: [MapComponent],
})
export class AppComponent {}

将其调整为类似

import { Component } from '@angular/core';

@Component({
  selector: 'app-tabs',
  template: `
    <mgl-map
      [style]="'https://demotiles.maplibre.org/style.json'"
      [zoom]="[9]"
      [center]="[-74.5, 40]"
    >
    </mgl-map>
  `,
  styles: [
    `
      mgl-map {
        height: 100%;
        width: 100%;
      }
    `,
  ],
  standalone: false
})
export class MapPage {
  constructor() {}
}

只显示黑屏。

我完全不明白教程中的代码应该如何工作，因为如果我只是直接实现教程代码，我的编译器会说 对象文字可能只指定已知属性，并且“NgModule”类型中不存在“模板”。

你能让教程中的代码运行吗？怎么做？

非常感谢您的帮助🙂

angular