Javascript ng2智能表复选框在所有页面上都不持久

我是ng2智能桌的新手。我正在尝试从GitHub页面修改下面的示例，以便在从一页移动到另一页时复选框不会消失

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',
    },
  ];
}

从'@angular/core'导入{Component}；
@组成部分({
选择器：“基本示例多重选择”，
模板：`
`,
})
导出类基本示例MultiSelectComponent{
设置={
选择模式：“多”，
栏目：{
身份证：{
标题：“ID”，
},
姓名：{
标题：'全名'，
},
用户名：{
标题：“用户名”，
},
电邮：{
标题：“电子邮件”，
},
},
};
数据=[
{
id:1，
姓名：'Leanne Graham'，
用户名：“Bret”，
电邮:'Sincere@april.biz',
},
{
id:2，
姓名：“埃尔文·豪厄尔”，
用户名：“Antonette”，
电邮:'Shanna@melissa.tv',
},
{
id:3，
姓名：'Clementine Bauch'，
用户名：“Samantha”，
电邮:'Nathan@yesenia.net',
},
{
id:4，
姓名：“帕特里夏·勒布萨克”，
用户名：“Karianne”，
电子邮件：“朱丽安。OConner@kory.org',
},
{
id:5，
姓名：“Chelsey Dietrich”，
用户名：“Kamren”，
电子邮件：“卢西奥_Hettinger@annie.ca',
},
{
id:6，
姓名：“Dennis Schulist夫人”，
用户名：“Leopoldo_Corkery”，
电子邮件：“Karley_Dach@jasper.info',
},
{
id:7，
名称：“Kurtis Weissnat”，
用户名：“Elwyn.Skiles”，
电子邮件：“电视。Hoeger@billy.biz',
},
{
id:8，
姓名：'Nicholas Runolfsdottir V'，
用户名：“Maxime_Nienow”，
电邮:'Sherwood@rosamond.me',
},
{
id:9，
姓名：“格伦娜·赖切特”，
用户名：“Delphine”，
电子邮件：“Chaim_McDermott@dana.io',
},
{
id:10，
姓名：'Clementina DuBuque'，
用户名：“Moriah.Stanton”，
电子邮件：“雷伊。Padberg@karina.biz',
},
{
id:11，
姓名：“尼古拉斯·杜布克”，
用户名：“Nicholas.Stanton”，
电子邮件：“雷伊。Padberg@rosamond.biz',
},
];
}

这将使用selectMode:“multi”选项显示带有复选框的列。复选框确实会显示，但每次我使用分页链接转到另一个页面时，所选内容都会被清除。我试图解决这个问题，因为我的项目中有一个类似的问题

---

我试图找到关于如何跨页面持久化选择的文档，但没有成功，因为可用的文档数量有限。这似乎是一个非常普遍的特性，应该有更多关于它的信息，但事实并非如此。在此问题上的任何帮助都将不胜感激。

我本人没有将multi-select与ng2智能表一起使用过，但是提到

doEmit:boolean-emit事件（刷新表）与否，默认值=true

我不确定这是否有效，但您可以尝试将其设置为

false

从数据创建数据源，然后修改分页器设置：

source: LocalDataSource;

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

如果这不起作用，您可以尝试添加事件侦听器，这些侦听器在检查时收集选中的行，并在刷新（或初始化）时重新选择它们。将事件回调添加到表中

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

如果这些都没有帮助，请在github上打开一个新问题，并希望开发人员知道一种简单的方法来解决此问题。：-）

---

如果这也失败了，那就按照我做的做，换成角度/材料2。他们的文档很糟糕，但总的来说，我认为它比大多数组件都好。

如果你想在应用程序的运行过程中维护数据，你必须以“持久的方式”保存这些数据，并使用ngOnInit中保存的数据。 在组件中，我使用Ngondestory和数据服务

@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;
}

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

import { LocalDataSource } from 'ng2-smart-table';

settings = {
  ...
}
data = [
  ...
]

source: LocalDataSource;

constructor() {
  this.source = new LocalDataSource(this.data);
  this.source.setPaging(1,10,false);
}