Búsqueda de sitios web

typescript - Ionic 2 document.getElementById devuelve nulo


Estoy creando una pequeña aplicación con Ionic 2. Ahora la estoy probando en el navegador con ionic serve. En mi archivo map.html, tengo el siguiente código:

<ion-content >
   <div  id="myMap"></div>
</ion-content>

En mi archivo map.ts, intenté hacer esto:

this.platform.ready().then((readySource) => {
console.log('Platform ready from', readySource);
console.log(document.getElementById('myMap'));
//this.initializeMap();
});

La consola muestra:

Plataforma lista desde dom nulo

Me rasco la cabeza mucho pero aún no puedo encontrar por qué no puede ubicar ese elemento.

¡Cualquier ayuda sería apreciada!

Respuesta #1

Si estás tratando de obtener el elemento basado en el id, podrías usar viewChild de Angular en lugar de usar JavaScript.

Para hacer esto escribiría el código así.

En tu map.html

<ion-content >
  <div #myMap></div>
</ion-content>

En tu map.ts

asegúrate de importar ViewChild desde @angular/core

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

...

export class MapPage {
  @ViewChild('myMap') myMap ;

  constructor(public viewCtrl: ViewController, params: NavParams) {
    console.log(this.myMap); //visit your element by using this.myMap
  }

}

Artículos relacionados