akveo / akveo/ng2-smart-table

[Question] data will not reload after page routing using Firestore.

Open
#890 2 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
1.6k
Forks
867
PR merge metrics
No merged PRs in 30d

Description

Hi there,

I am new here, could you please help me to check how to reload the data after page routing and keep the Firestore data source in the ng2-smart-table?

my Firestore service :
`import { Injectable } from '@angular/core';

import { AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument } from '@angular/fire/firestore';

import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

export interface student {
id?: string;
status: string;
action: string;
name: string;
}

@Injectable({
providedIn: 'root'
})
export class FirestoreService {

studentsCollection: AngularFirestoreCollection;

public students: Observable;

constructor(private afs: AngularFirestore) {
this.studentsCollection = this.afs.collection('students');
this.students = this.studentsCollection.snapshotChanges().pipe(
map((actions) => {
return actions.map((a) => {
const data = a.payload.doc.data();
return { id: a.payload.doc.id, ...data };
});
})
);
}

getData(){
// ['added', 'modified', 'removed']
return this.students;
}
}
`

and ng2-smart-table:
`import { Component,OnInit } from '@angular/core';
import { LocalDataSource } from 'ng2-smart-table';

import { SmartTableService } from '../../../@core/data/smart-table.service';
import { FirestoreService, student } from '../../../@core/data/firestore.service';

@Component({
selector: 'ngx-smart-table',
templateUrl: './smart-table.component.html',
styles: [`
nb-card {
transform: translate3d(0, 0, 0);
}
`],
})
export class SmartTableComponent implements OnInit{
students: student[];
student: student = {
status: "status",
action: "action",
name: "name",
}
settings = {
add: {
addButtonContent: '',
createButtonContent: '',
cancelButtonContent: '',
},
edit: {
editButtonContent: '',
saveButtonContent: '',
cancelButtonContent: '',
},
delete: {
deleteButtonContent: '',
confirmDelete: true,
},
columns: {
id: {
title: 'ID',
type: 'number',
},
firstName: {
title: 'First Name',
type: 'string',
},
lastName: {
title: 'Last Name',
type: 'string',
},
username: {
title: 'Username',
type: 'string',
},
email: {
title: 'E-mail',
type: 'string',
},
age: {
title: 'Age',
type: 'number',
},
},
};

source: LocalDataSource;

constructor(private service: SmartTableService, private fs:FirestoreService) {
//const data = this.service.getData();
//this.source.load(data);
}

ngOnInit() {

this.fs.getData().subscribe(res => {
this.source = new LocalDataSource(res);
});
}

add() {
this.fs.createStudent(this.student);
}

onDeleteConfirm(event): void {
if (window.confirm('Are you sure you want to delete?')) {
event.confirm.resolve();
} else {
event.confirm.reject();
}
}
}
`

the ng2-smart-table will load the data from Firestore in first time, and after I switch to other page and back ng2-smart-table again the data were disappear.

BR,
Iron.Huang

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.