Javascript 无法在本地主机上呈现简单映射对象

在下面发布的代码中，我试图显示一个简单的地图。我参考了openlayer官方网站并使用了下面提到的代码。 代码不包含错误，编译成功，但没有显示映射。 请让我知道如何解决此问题

html：

<a routerLink = "new-cmp">New component</a>
<br />
<br/>
<router-outlet></router-outlet>
<div id="map"></div>

ngOnInit(){

  this.map = new Map({
  target: 'map',
  layers: [
    new TileLayer({
      source: new OSM()
    })
  ],
  view: new View({
    center: [0, 0],
    zoom: 0
  })
});
}

---

逻辑和映射div在同一个组件中吗？检查浏览器控制台，它可能找不到div。同样在angular中，您使用@ViewChild引用DOM对象，这也是您的div未被选中的原因。@MaulikParmar是的，它们位于同一组件中。浏览器控制台显示没有错误。我没有使用ViewChildOfc，您需要

@ViewChild（“mapDiv”）divView:ElementRef

并用

#mapDiv

或do

document.getElementById（'map'）标记div

要获取实际的div对象，很可能引用未定义。此外，您需要尊重组件生命周期，因此在初始化后获取引用，即

ngAfterViewInit（）{const map=document.getElementById（'map'）；//map init code}

@MaulikParmar我是否应该添加'@viewchild（'mapDiv'）'