[Table] Add example with dynamic data (add/remove/edit rows)

[tyler2cr]

Bug, feature request, or proposal:

cdk table API docs need instructions and/or an example of updating the dataSource in the table connecting the table to a data source

What is the expected behavior?

seeing implementation instructions and/or an example of how to send the updated dataSource to the table so that the connect function is called

What is the current behavior?

The docs only cover rendering data on initial load of the component, but if a service updates the data, there isn't a documented way to update the data-table

What are the steps to reproduce?

Providing a Plunker (or similar) is the best way to get the team to see your issue. Plunker template: https://goo.gl/DlHd6U

What is the use-case or motivation for changing an existing behavior?

the md-table API doc hints at an approach but also lacks clarity

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

angular 4 material 2 typescript 2.4 windows

Is there anything else we should know?

[AdPik]

Hello, I have problem with my code. Any ideas? Thank you ! https://stackoverflow.com/questions/51478019/binding-the-data-into-mat-table-angular

[furqan-shakir]

@irossimoline I liked your solution, Can I use it with reactive forms and formArray?

[avatsaev]

I created a library to solve that (seamless http paginating/sorting/filtering with MatTable), the docs are not ready yet, but you have a complete functional usage example in src/app: https://github.com/avatsaev/ngx-mat-table-extensions

If any adventurous folks want to try it out and let me know if I need to add anything else before official release?

online demo is here: https://stackblitz.com/github/avatsaev/ngx-mat-table-extensions

[edenchen123]

this.dataSource.data = [...this.dataSource.data, {}];

[edenchen123]

this.dataSource.data = [...this.dataSource.data, {}];

[jayDesai89]

Is there any update or new info available on this issue?

I have created below the table and I have a pretty much same CRUD operation requirement on this table. I am also using mat-dialog for pop up. Parent-child(main HTML - popup HTML) communication between component is working but at the same time want to update view - backend data in real time At this stage I am using locally created json mock data. Below is the image of the table

[jayDesai89]

Any updates on this issue?

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}