Is this project updated with latest angular version i.e. angular? about angular-mat-table-crud

[marinantonio]

I haven't checked Angular 6 yet, but I don't think there's much of a difference

[marinantonio]

@vvavdiya Not sure did you notice but updating Angular is such a stresfull thing to do and you always get mixed results. Anyway I did check it now, besides changes in angular material I've noticed some RxJS code should be rewritten as well. So this project isn't at the moment compatible with Angular v6.

[Folrond]

Actually the "core part" of this soulution that makes the table work can be copied into an angular 6 project and it works well it can be improved here and there but so far this is one of the better solutions for supporting crud in material table.

So the answer is:
1, No, it is not an out of the box angular 6 solution
2, Yes, the code works with angular 6

[vasilikivmo]

@vvavdiya Not sure did you notice but updating Angular is such a stresfull thing to do and you always get mixed results. Anyway I did check it now, besides changes in angular material I've noticed some RxJS code should be rewritten as well. So this project isn't at the moment compatible with Angular v6.

Could you explain how you fixed the issue with RxJS? I am using Angular6, and even though I change the way I make the import, something doesn't go well... Thanks!

[marinantonio]

@vasilikivmo I still didn't, it requires a little bit of learning curve.

[vasilikivmo]

@vasilikivmo I still didn't, it requires a little bit of learning curve.

I managed to do it. I had to modify the way I do the import of merge, fromEvent, BehaviorSubject inside my component and also make sure that both the versions of rxjs and rxjs-compat are updated

[marinantonio]

I've updated master as well. Key changes are below:

Updated rxjs imports

import {BehaviorSubject, fromEvent, merge, Observable} from 'rxjs';
import {map} from 'rxjs/operators';

And operators:

    return merge(...displayDataChanges).pipe(map( () => {
        // Filter data
        this.filteredData = this._exampleDatabase.data.slice().filter((issue: Issue) => {
          const searchStr = (issue.id + issue.title + issue.url + issue.created_at).toLowerCase();
          return searchStr.indexOf(this.filter.toLowerCase()) !== -1;
        });

        // Sort filtered data
        const sortedData = this.sortData(this.filteredData.slice());

        // Grab the page's slice of the filtered sorted data.
        const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
        this.renderedData = sortedData.splice(startIndex, this._paginator.pageSize);
        return this.renderedData;
      }
    ));
}