CODEWITHSUNDEEP
angular
Dalitos
Dalitos

Reputation: 109

Angular Function Call in HTML

I have an Angular Project and in one component i want to show data by calling a function to the corresponding component.ts.

For example (very simplified)

<div *ngFor="let article of article">
  <h1>{{getTitle(article)}}</h1>
</div>

If i check a console.log in the getTitle function there are a lot of logs, thus the function gets triggerd due to angular events to rerender i would say.

Now i am thinking maybe it is not the best idea to do it in this way? Assumed lot of data in a ngfor loop are shown. What do you think?

Upvotes: 0

Views: 807

Answers (1)

fatalcoder524
fatalcoder524

Reputation: 1480

You can do something like this.

component.ts:

class Article
{
title:string
author:string
}
articles=[
new Article("title1","author1"),
new Article("title2","author2")
];

component.html:

<div *ngFor="let article of article">
  <h1>{{article.title}}</h1>
</div>

Upvotes: 2

Related Questions