角2 - 関数を渡す方法* ngFor

* ngForループや他の提案にどのように関数を渡すことができますか？角2 - 関数を渡す方法* ngFor

Iは、TODOリストのコンポーネントと子TODO項目の構成要素を持っている - 私は以下のコードを確認してください付加価値を返す関数を渡したい： - 藤堂リストコンポーネント

`<div class="list-group"> 
    <app-todo-item 
    *ngFor="let todo of todos; let i = index" 
    [todoItem]="todo" 
    [index]="i"></app-todo-item> 
</div>`

を

- 藤堂項目コンポーネント `

<a 
    [routerLink]="index" 
    [routerLinkActive]="'list-group-item-warning'" 
    class="list-group-item"> 
    {{ todo.name }} 
    <span class="badge badge-pill" 
    [ngClass]="{'badge-success': todo.status === 'active', 'badge-warning': todo.status === 'inactive'}">{{ todo.status }}</span> 
    <div class="option-group float-right"> 
    <span class="badge badge-dark">2 days ago myFunction(date)</span> 
    </div> 
</a> 
`

私はこれを達成する可能性のあるどのような方法教えてください。ありがとうございます

出典

2017-08-29 Rajat Sharma

app-todo-itemコンポーネントに関数を渡そうとしていますか？

私はTODO項目テンプレートどのように私のコールバック関数の値を印刷したい場合ので、あなたは、角コアから私はポイントを得た

出典

2017-08-29 08:36:44 masterpreenz

感謝を助け

// import it inside your component import { Output, EventEmitter } from '@angular/core' // declare the function callback you want to recieve @Output() callback = new EventEmitter(); // to make the callback send data back call, if you want to pass multiple fields put it all inside an object this.callback.emit(datatobepassed) // to make use of it do; you need to put $event or else function recieves undefined <app-todo-item (callback)=”yourfunction($event)”> // in your parent component yourfunction(data: any) { // stuff }

希望... –

一つのことを@Outputを使用することができればこれはできますか？ –

これは、コールバック関数がデータを 'app-todo-item'コンポーネントに送り返すことを意味しますか？ – masterpreenz

角2 - 関数を渡す方法* ngFor

答えて

関連する問題