Je dois créer un simple composant Angular nommé LabelComponent avec label-component pour selecteur.
Il doit afficher un <div> avec la classe label.
Il prend deux entrées, un texte label à afficher et une couleur de texte color.
Ainsi :
<label-component label='Hello World!' color='red'></label-component>
Doit afficher :
<div class="label" style="color: red;">Hello World!</div>
Voici le code Angular:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
| // Angular 8.x code
import { Component, Input, NgModule } from '@angular/core';
@Component({
selector:'...',
template: `
<div>Hello World</div>
`
})
export class LabelComponent {
}
// #region Preview
@Component({
template: `<label-component label='Hello World!' color='red'></label-component>`
})
export class PreviewComponent { }
// #endregion Preview
// #region Module declaration - Do not Change
@NgModule({
declarations: [PreviewComponent, LabelComponent],
entryComponents: [PreviewComponent]
})
export class PreviewModule { }
// #endregion Module declaration |
Moi j'ai complété le code de cette façon suivante:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
| // Angular 8.x code
import { Component, Input, NgModule } from '@angular/core';
@Component({
selector:'label-component',
template: `
<div class="label" style="color:red;">Hello World!</div>
`
})
export class LabelComponent {
}
// #region Preview
@Component({
template: `<label-component label='Hello World!' color='red'></label-component>`
})
export class PreviewComponent { }
// #endregion Preview
// #region Module declaration - Do not Change
@NgModule({
declarations: [PreviewComponent, LabelComponent],
entryComponents: [PreviewComponent]
})
export class PreviewModule { }
// #endregion Module declaration |
Est ce qu'il y'a d'autres endroits que je dois compléter encore?
Partager