ng2スマートテーブルのチェックボックスがすべてのページで永続的でない

Question

ng2-smart-tablesを初めて使用しました。私はGitHubページから以下の例を変更して、ページ間を移動するときにチェックボックスが消えないようにしています。チェックボックスの列を表示するために「multi'option：

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'basic-example-multi-select', 
    template: ` 
    <ng2-smart-table [settings]="settings" [source]="data"></ng2-smart-table> 
    `, 
}) 
export class BasicExampleMultiSelectComponent { 

    settings = { 
    selectMode: 'multi', 
    columns: { 
     id: { 
     title: 'ID', 
     }, 
     name: { 
     title: 'Full Name', 
     }, 
     username: { 
     title: 'User Name', 
     }, 
     email: { 
     title: 'Email', 
     }, 
    }, 
    }; 

    data = [ 
    { 
     id: 1, 
     name: 'Leanne Graham', 
     username: 'Bret', 
     email: 'Sincere@april.biz', 
    }, 
    { 
     id: 2, 
     name: 'Ervin Howell', 
     username: 'Antonette', 
     email: 'Shanna@melissa.tv', 
    }, 
    { 
     id: 3, 
     name: 'Clementine Bauch', 
     username: 'Samantha', 
     email: 'Nathan@yesenia.net', 
    }, 
    { 
     id: 4, 
     name: 'Patricia Lebsack', 
     username: 'Karianne', 
     email: 'Julianne.OConner@kory.org', 
    }, 
    { 
     id: 5, 
     name: 'Chelsey Dietrich', 
     username: 'Kamren', 
     email: 'Lucio_Hettinger@annie.ca', 
    }, 
    { 
     id: 6, 
     name: 'Mrs. Dennis Schulist', 
     username: 'Leopoldo_Corkery', 
     email: 'Karley_Dach@jasper.info', 
    }, 
    { 
     id: 7, 
     name: 'Kurtis Weissnat', 
     username: 'Elwyn.Skiles', 
     email: 'Telly.Hoeger@billy.biz', 
    }, 
    { 
     id: 8, 
     name: 'Nicholas Runolfsdottir V', 
     username: 'Maxime_Nienow', 
     email: 'Sherwood@rosamond.me', 
    }, 
    { 
     id: 9, 
     name: 'Glenna Reichert', 
     username: 'Delphine', 
     email: 'Chaim_McDermott@dana.io', 
    }, 
    { 
     id: 10, 
     name: 'Clementina DuBuque', 
     username: 'Moriah.Stanton', 
     email: 'Rey.Padberg@karina.biz', 
    }, 
    { 
     id: 11, 
     name: 'Nicholas DuBuque', 
     username: 'Nicholas.Stanton', 
     email: 'Rey.Padberg@rosamond.biz', 
    }, 
    ]; 
} 

この

はのselectModeを使用しています。チェックボックスは表示されますが、ページ設定リンクを使用して別のページに移動するたびに選択がクリアされます。私は私のプロジェクトにこれに類似した問題があるので、この問題を解決しようとしています。

選択肢をページ間で維持する方法についてのドキュメントを検索しようとしましたが、限られた量のドキュメントしか利用できないため、成功しませんでした。これは、そこにもっと多くの情報があるはずだが、そうではないような一般的な機能のようだ。この問題に関する助けをいただければ幸いです。

Answer 1

私はNG2-スマートテーブルで自分自身を複数選択使用していないが、documentationは

doEmit言及：ブール - 、（表をリフレッシュするために）イベントを発するか、デフォルト=真

を

これがうまくいくかどうかわかりませんが、これをfalseに設定してみてください。

あなたのデータからデータソースを作成し、ページネータの設定を変更します。

source: LocalDataSource; 

constructor() { 
    this.source = new LocalDataSource(this.data); 
    this.source.setPaging({ doEmit: false }); 
} 

これが動作しない場合は、チェックにチェックした行を収集し、イベントリスナーを追加してみてください可能性があり、それらを再選択しますリフレッシュ時（またはinit時）。テーブルにイベントコールバックを追加する...

<ng2-smart-table [settings]="settings" [source]="source" (rowSelect)="onRowSelect($event)" (userRowSelect)="onUserRowSelect($event)"></ng2-smart-table> 

...イベントを記録し、そこから使用可能な情報があるかどうかを確認してください。これのどれも助けていない場合は

onRowSelect(event) { 
    console.log(event); 
} 

onUserRowSelect(event) { 
    console.log(event); 
} 

は、githubの上に新しい問題を開いて、開発者がこの問題を解決する簡単な方法を知っている願っています。 :-) それも失敗したら、私がやったことをして、angular/material2に切り替えてください。彼らのドキュメントはうんざりですが、全体的に私はそれがそこのほとんどのコンポーネントより優れていると思います。

Answer 2

アプリケーションのライブに沿ってデータを維持する場合は、このデータを「永続的な方法」で保存し、ngOnInitに保存されたデータを使用する必要があります。コンポーネントで は、IがngOnDestroyとのDataService

@Component({ 
}) 

export class MyComponent implements OnInit,OnDestroy {} 
    variable1:number 
    variable2:number 
    contructor(private state:MyComponentData) 
    ngOnInit() { 
     let data=this.state.Data?data:null; 
     this.variable1=(data)?data.variable1; 
     this.variable2=(data)?data.variable2; 
    } 
    ngOnDestroy() 
    { 
     this.state.Data={ 
      variable1:this.variable1, 
      variable2:this.variable2 
     } 
    } 

を使用するサービスは

@Injectable() 
export class MyComponentData{ 
    Data:any; 
} 

ように簡単です