如何更改map对象中的属性值

Question

我想知道如何为地图的目标属性设置值。在下面发布的代码中，我希望将目标属性更改为mapTest，而不是map。为此，我做了以下工作：

#mapTest {
    width: 800px;
    height: 550px;
  }
</style>
    <div id="mapTest"></div>
    <script src="./index.js"></script>

并相应地修改了目标如下：

    target: 'mapTest',

但是代码没有显示任何内容，请让我知道如何正确地更改map对象的目标属性。

app.component.html

    <div class="MousePosition">
  <div id="mouse-position"></div>
</div>
<form>
  <label for="projection">Projection </label>
  <select id="projection">
    <option value="EPSG:4326">EPSG:4326</option>
    <option value="EPSG:3857">EPSG:3857</option>
  </select>
  <label for="precision">Precision</label>
  <input id="precision" type="number" min="0" max="12" value="4"/>
</form>
<style>
  #map {//<---i want to change this
    width: 800px;
    height: 550px;
  }
</style>
    <div id="map"></div>
    <script src="./index.js"></script>

app.component.ts

ngOnInit() {
this. map = new Map({
controls: defaultControls().extend([mousePositionControl]),
target: 'map',//<---i want to change this
layers: [
  new TileLayer({
    source: new XYZSource({
      url: 'http://tile.stamen.com/terrain/{z}/{x}/{y}.jpg'
    })
  })
],
view: new View({
  center: [0, 0],
  zoom: 0
})
});
 }

Answer 1

好的，所以我不知道确切的问题是什么，但是这里有一些指针，Map类有一个方法setTarget，您可以在这里更改目标属性，但是您也需要触发render方法，所以它将在一个新的元素容器中呈现映射，它应该如下所示：

onSomeEvent() {
    this.map.setTarget('mapTest');
    this.map.render();
}

在sidenote中，this. map中的点和地图之间有一个空格，希望这不是在实际代码中。