クリックした後、チェックされた項目を同じページの他のタブに移動します。

Question

メッセージのリストがあります。メッセージがチェックされて保存されると、そのメッセージは別のタブに移動され、保存されます。私はその機能が働いている。ただし、各保存後、最後のメッセージは前のメッセージを上書きします。 DOMを操作せずに各保存後にメッセージを何らかの形で追加する必要があります。私はイオン3を使用しています。メッセージは保存されたメッセージです。 rmessagesは、ユーザーが受け取るメッセージです。

活字体

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> 

Answer 1

だけに（）セーブ機能変更：

save(){ 

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

}