hi everybody
I've a little noob question,
I'm just a beginner. I'm trying to retrieve some data from an array.
I success to print data but not the first.
here is the app.component.html
<div class="container">
<div class="row">
<div class="col-xs-12">
<h2>Mes Posts</h2>
<p>Mis à jour : {{ lastUpdate | date:'EEEE d MMMM y' | uppercase }}</p>
<ul class="list-group">
<app-post *ngFor="let post of posts; index as i"
[PostIndex]="i"
[PostName]="post.name"
[PostData]="post.contenu"
[PostDate]="post.date"
[PostLove]="post.lovelevel">{{i}}
</app-post>
</ul>
</div>
</div>
</div>
this is the app.component.ts
export class AppComponent {
lastUpdate = new Date();
posts = [
{
name: 'Mon Premier post',
date : this.lastUpdate,
contenu : 'Tafgdgta titi toto',
lovelevel : 0,
},
{
name: 'Mon Premier post',
date : this.lastUpdate,
contenu : 'Tafgdgta titi toto',
lovelevel : 0,
},
{
name: 'Mon Premier post',
date: new Date() ,
contenu : 'Comme vous le constaterez, le CLI a créé un nouveau sous-dossier'
,
lovelevel : 0,
},
{
name: 'Mon Deuxième post',
date: new Date() ,
contenu : 'Tata titi toto',
lovelevel : 0,
},
{
name: 'Mon Post N°3',
date: new Date() ,
contenu : 'Tata titi toto',
lovelevel : 0,
},
{
name: 'Mon dernier post',
date : new Date(),
contenu : 'Tata titi toto',
lovelevel : 0,
}
];
}
this post.component.html
<li [ngClass]="{'list-group-item':true,
'list-group-item-success': getColor() === 'green',
'list-group-item-danger': getColor() === 'red'}">
<h4 [ngStyle]="{color: getColor()}">{{PostName}} - {{PostLove}} -/*
N°{{PostIndex}} </h4>
{{ PostDate | date:'EEEE d MMMM y'}}
<div><h5>{{PostData }}</h5></div>
<button class="btn btn-success" (click)="OnLove()">Love it!</button>
<button class="btn btn-danger" (click)="OnDontLove()">Don't love it!</button
>
</li>
and post.component.ts
export class PostListComponent implements OnInit {
@Input() PostName: string;
@Input() PostDate: 'new Date()';
@Input() PostData : string;
@Input() PostLove : number;
@Input() PostIndex : number;
constructor() { }
getColor() {
if (this.PostLove > 0) {
return 'green';
} else if (this.PostLove < 0) {
return 'red';
}
}
OnLove() {
this.PostLove= this.PostLove+1;
return this.PostLove;
}
OnDontLove() {
this.PostLove= this.PostLove-1;
return this.PostLove;
}
getLove() {
if (this.PostLove > 0) {
return true;
} else { return false}
}
getNoLove() {
if (this.PostLove < 0) {
return true;
} else { return false}
}
ngOnInit() {
}
}
but it return me this :
[image: 2019-01-16 16_29_43-MonBlogAngular.png]
The first Item is blank ! Can you tell me why ?
Thanks in advance :)
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
