Angular 2 Voir la référence enfant / élément en sélectionnant le même élément deux fois

Question

Tout d'abord, permettez-moi de commencer par dire que j'ai lu les documents, certains articles, le chapitre ng-book, etc. Je ne sais toujours pas comment ces choses fonctionnent.

Cela dit, considérez ce qui suit:

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

@Component({
  selector: 'home',
  template: `
    <div>Test</div>
    <input type="text"#testElem>
    <input type="text"#testElem2>
  `
})


export class HomeComponent{

  @ViewChild('testElem') el:ElementRef;
  @ViewChild('testElem2') el2:ElementRef;

  ngAfterViewInit() {
    this.el.nativeElement.style.background = "red";
    this.el.nativeElement.style.background = "blue";
  }

}

Plunker

Pourquoi mon premier élément devient-il bleu et le deuxième élément ne se colore-t-il pas du tout?

Answer 1

Vous utilisez el à la place el2 sur votre deuxième ligne, ce qui signifie que vous définissez background de votre premier div sur red d'abord, puis juste après sur blue, mais vous ne le faites pas ' Ne faites rien avec votre deuxième div:

this.el.nativeElement.style.background = "red";
this.el.nativeElement.style.background = "blue";

Ça devrait être:

this.el.nativeElement.style.background = "red";
this.el2.nativeElement.style.background = "blue";