6

How to add a new row into Angular Material table manually from a input field.

Please see this image in that if i add a state name and state code it should present in the following table please help me how to achieve it using Angular 4.

angular material table

2
  • Please post what you have done so far Commented Apr 23, 2018 at 14:44
  • sorry i don't have any idea on that i should try now Commented Apr 24, 2018 at 3:47

1 Answer 1

13

I've put together a quick example that should give you a good hint as to where to start from: Working demo

This works by using two-way data binding on the input field to keep track of what the user typed in the form. When the add button is then pressed, the table is updated with a new element dynamically created with the input content.

Sign up to request clarification or add additional context in comments.

4 Comments

Hi thank you it works but i have one more doubt how to add data using angular http crud
Hi .. any idea if i want the new row at top of table rather than bottom then how to do it?
@saad sure, just use unshift instead of push
unshift works ... but it gives index as 1 .. so there are multiple row with index 1.How to dynamically change row number

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.