angular 2新しいテーブル項目をテーブルの先頭に挿入

Question

私はテーブルにTODOを追加するコンポーネントを持っています。新しいTODOを底面ではなくテーブルの最上部に追加する方法を知りたかったのです。私はJSでこれを達成する方法を示すSOにいくつかの答えを見ましたが、私はTypescriptでそれを行う方法を知りたがっていました。どんな助けでも大歓迎です、ありがとう！ Typescriptで

Answer 1

。

例http://plnkr.co/edit/7FC8IUvdR3wPevrd48yt?p=preview

<div> 
    <input type="text" [(ngModel)]="newTodo" placeholder="Add New Todo"/> 
    <button type="button" (click)="addTodo()">Add</button> 
</div> 
<div> 
    <ul> 
    <li *ngFor="let todo of todos">{{todo}}</li> 
    </ul> 
</div> 


export class App { 
    newTodo: string; 
    todos: Array<string>; 

    constructor() { 
    this.newTodo = ""; 
    this.todos = ["Grocery Shopping", "Banking"]; 
    } 

    addTodo() { 
    this.todos.unshift(this.newTodo); 
    this.newTodo = ""; 
    } 
} 

Answer 2

splice機能は、あなたが欲しいものを行うために使用することができます。

DEMO：あなたはちょうどあなたの配列の初めに項目を追加するために使用することができますアンシフトhttps://plnkr.co/edit/B5l1fCOvItkt45cJMBKO?p=preview

<input type="text" #newItem> 
<button (click)="add(newItem.value)">Add</button> 

<table> 
    <tr *ngFor="let item of items"> 
     <td>{{item.name}}</td> 
    </tr> 
</table> 

---

export class App { 

    items=[{name:"Computer"},{name:"Laptop"}]; 
    add(newItem){ 
    this.items.splice(0,0,{name:newItem}); 
    } 
}