7 votes

ElementRef du composant Angular2 ne fonctionne pas

Je voudrais créer un composant dans Angular 2 où je peux passer des valeurs à partir du HTML. Je pensais utiliser ElementRef mais je ne parviens pas à le référencer sans erreur.

Voici mon code :

import { Component, ElementRef } from '@angular/core';
@Component({
    selector: 'my-app',
    template: `
    <p>Hello World</p>
    `
})
export class MyAppComponent {
    constructor(private el: ElementRef) {}
    ngOnInit() {
        this.el.nativeElement.style.backgroundColor = 'red';
    }
}

Ce code est juste pour tester si je peux contrôler ou au moins vérifier l'élément dom du composant, mais cela ne fonctionne pas.

Plus tard, je veux pouvoir obtenir des variables à partir du HTML, par exemple

<my-app variable="value"></my-app>

L'erreur que je reçois est la suivante

Unhandled Promise rejection: Can't resolve all parameters for MyAppComponent: (?). ; Zone: <root> ; Task: Promise.then ; Value: Error: Can't resolve all parameters for MyAppComponent: (?).

J'utilise la version 2.0.0 (non rc) récemment publiée.

5voto

srini Points 90

Fonctionne pour moi.

import { Component, ElementRef } from '@angular2/core';
     @Component({
           selector: 'my-app',
           template: `
           <p>Hello World</p>
           {{title}}
           `
})

export class MyAppComponent {
title: string = "This Text will be in red Color";

constructor(private el: ElementRef) {}
ngOnInit() {
    this.el.nativeElement.style.backgroundColor = 'red';
}
}

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X