Angular2: Cuál es la mejor manera de obtener una referencia de un elemento de plantilla [duplicar]

Esta pregunta ya tiene una respuesta aquí:

• ¿Cómo puedo seleccionar un elemento en una plantilla de componente? 10 respuestas

Digamos que tengo un componente como este en Angular 2.

@Component ({
   directives: [Timeline, VideoPlayer],
   template: `<div>
    <span id="myId"></span>
    <videoplayer [mode]="mode"></videoplayer>
    <timeline [mode]="mode"></timeline>
  </div>`,
})
export class VideoEditor {
}

¿Cómo puedo obtener una referencia a un elemento de una plantilla? Por ejemplo, ¿cómo obtengo una referencia a un <span>?

Encontré dos enfoques para far:

1) Obtener una referencia usando ElementRef

export class VideoEditor {    
  constructor (private el: ElementRef) {
    el.nativeElement.getElementsBy.....;
  }
}

2) Usando ViewChild

export class VideoEditor {  
  @ViewChild(Timeline) timeline: Timeline;  
  ngAfterViewInit () {
    this.timeline;
  }
}

3) Usando variable de plantilla local

1) Lo que no me gusta de un primer enfoque es que necesito hacer una función similar a getElementsBy....

2) Con respecto a un segundo, no se como obtener acceso a un elemento HTML, solo puedo obtener acceso a otro subcomponente. ¿Y qué pasa si tengo más subcomponentes del mismo tipo?

3) Local la variable de plantilla solo funciona dentro de una plantilla, ¿tengo razón?

¿Cuál es la mejor manera de obtener una referencia a una plantilla en Angular 2? Me gustaría tener algo como React tiene https://facebook.github.io/react/docs/more-about-refs.html#the-ref-string-attribute

<input ref="myInput" />

var input = this.refs.myInput;
var inputValue = input.value;
var inputRect = input.getBoundingClientRect();