javascript - 单击后将选中的项目移至同一页面的其他选项卡

我有邮件列表。检查并保存一条消息后，该消息应移至另一个选项卡-我们称其为已保存。我正在使用该功能；但是，每次保存后，最后一条消息将覆盖先前的消息。我需要以某种方式在每次保存后追加消息，而无需操作DOM。我正在使用Ionic3。amessages是已保存的消息。 rmessage是用户收到的消息。

打字稿

import { Component } from '@angular/core';
import { NavController} from 'ionic-angular';

@Component({
  selector: 'page-messages',
  templateUrl: 'messages.html'
})
export class MessagesPage {
selectedAll: boolean = false;
messages: string = 'messages';
singleChecked: boolean = false;
rmessages: any[] = [
    { text: 'This is a test message.' , selected: false },
    { text: 'This is a second test message.', selected: false },
    { text: 'This is a third test message.', selected: false }
  ];
 amessages: any[] = [];

  constructor(public navCtrl: NavController) {
}


checkAll(){
  console.log(this.messages.length)
  if(this.selectedAll){
    this.selectedAll = true
  }
  else {
    this.selectedAll = false
  }
}

save(){

this.amessages = this.rmessages.filter(function(x) { return x.selected})

this.rmessages.filter(function (x){
      return x.selected;}).map(function(y){
        return y.text;});
  this.rmessages =  this.rmessages.filter(function (x) { return !x.selected;})

}

的HTML

<ion-content class="checks">

    <div [ngSwitch]="messages">

    <ion-list active *ngSwitchCase="'received'">
      <ion-item>
        <ion-label>select all</ion-label>
        <ion-checkbox (click)="checkAll()" [(ngModel)]="selectedAll" ></ion-checkbox>
      </ion-item>

    <ion-item *ngFor="let rmessage of rmessages; index as i">
        <ion-label>{{rmessage.text}}</ion-label>
        <ion-checkbox [checked]="selectedAll" [(ngModel)]="rmessage.selected" ></ion-checkbox>
    </ion-item>
        <button ion-button full (click)="save()"  style="font-size:1.8rem">save</button>
    </ion-list>

  <ion-list radio-group *ngSwitchCase="'sent'">
    <ion-list-header>Saved Messages</ion-list-header>
        <ion-item *ngFor="let amessage of amessages; index as i" >
        <ion-label>{{amessage.text}}</ion-label>
        </ion-item>
  </ion-list>
</div>
</ion-content>

最佳答案

只需将save（）函数更改为：

save(){

   this.amessages.concat( this.rmessages.filter(function(x) { return x.selected}));
   this.rmessages =  this.rmessages.filter(function (x) { return !x.selected;})

}