goo.gl/bPcyXW : Buy me a Coffee. goo.gl/3VQn29 : Next Part bit.ly/2KQN9xF : More Angular Tutorials bit.ly/3Ktqess : MEAN Stack CRUD bit.ly/47yygKq : (Angular & .Net Core API) Tutorials
Amazing and very usefull!!! just two comments: 1.- I would recommend you to create an array for all the material (in the matearial module) and pass that array once to import and export. In that case you don't need to duplicate the modules imported. 2.- For the required fields, instead of adding * to the placeholder you can add required to the field which I think is much better. e.g.
Excellent, as a noob I learned a lot of things from this video as compared to other videos. Thank You and please continue this work with Get, Post, Put and Delete API
@@joaoortega1868 yes that is a major flaw in Javascript. TypeScript when compiled enforces encapsulation but the Javascript result is not. that is why it is not a proper language, honestly.
Thank you so much for this awesome tutorial on Form designing using Angular and Firebase. This tutorial has been of immense help to me in achieving my goal. Tutorial was very informative and systematically explained in step by step way. Keep up with this effort of teaching and spreading coding knowledge to everyone!!!!
Great tutorial! This example is a good way to start learning angular. I have encountered only two issues: 1. When clearing the form, I got an error in the console because the initialize method from the service was not recognized. Removed the providedIn: 'root' from the @Injectable and it worked; 2. import * as Material from "@angular/material" does not work anymore (angular 9). I had to import each module separately;
How can we achieve this? if the form has been filled by database, I would like to show all the error messages on the form. I dont want to go each one of them and leave the control to show error. Can we achieve this?
Hi, On clicking the clear button, the data is getting erased but the error seems to get highlighted for the required fields. How can we remove them after we clear the form. Can you please help.
Hi, how we can do validations for a number field, like that it should contain only whole numbers..if we enter some decimal, or negative integers, it should be validated,..i want this... Kindly help me in this
Somewhere between this video and the next one in the sequence, the code for populating the Departments changes from a hard-coded list to one that comes from the Firebase database that is created during that next video. However, I'm over half way through the next video and do not see any discussion of how the "departments" table is populated so that it can supplant the previously hard-coded list of departments. How can I populate that Firebase database table so that the code for the next video works properly?
department table is render from firebase collection departments, which is discussed in second video here : th-cam.com/video/hfhlzY3U27M/w-d-xo.html. The firebase collection documents are inserted manually.(Other ways the video will be long one - If you watch this whole series. you create separate form for adding departments ). And then this shows how you can display department records from the firebase collection.
Hello there. Thanks a bunch for the clean Tutorial. I have been using your directions on my personal project. It was god sent. However, I have a serious headache. I put your tutorial directions (heavily modified). However, when using the ROUTERS in angular for some reason view and viewchildren does not wait for any response and especially "MatSort" is not working along with the codes... Any chance you can direct me for what to do about it? Is it really related to router guards or something else? Can you check it?
it is due to latest update in angularfire 2 npm installation command : npm i --s firebase @angular/fire try these import statement: import { AngularFireModule } from '@angular/fire; import { AngularFireDatabaseModule } from '@angular/fire/database
thanks for video... i use 'mat-selection-list' for filtering my list. But When I checked the my list, after submitting to the server, only the filtered list is displayed and there are no checked filters! And the items that are not checked out after the filter is lost !!! Please cover this topic ...
Don't just paste project from Download folder. You have to create a new project just by yourself like ng new, and when you create a new project (since angular provides all necessary constructive files), then paste those files form github in that new project you'll be able to use them. You're welcome dude
Hi... I followed all the above steps. But it is throwing an error saying 'Cannot find module '@angular/material' for the line import * as Material from "@angular/material"; . How to resolve it??
Hi ,very understandable thanks for that.But i got an error while binding the form with group..why am i getting this...i did the same what you were teaching,,,i got this error Can't bind to 'FormGroup' since it isn't a known property of 'form'. 1
Hey Saranya did you solve this issue. I am using Angular 10 and following this tutorial but I am stuck with that error. The only solution is to move the service class logic to the component which isn't recommended.
I have a problem with [formGroup] = "service.form" tells me "identifier 'service' refers to a private member of the component" I do not understand, I have everything the same
@@Link2618 I had the same error. Switching the service from private to public fixes it. I also use VS code and after some stack Overflow rabbit holes its aparently better practice when dealing with views to list services as public
I got this error: Property 'service' is private and only accessible within class 'EmployeeComponent'. I need to change to public. Im using Angular CLI: 9.1.7, Node 12.17.0. Please give me any suggestion
@@anju199602 yes. U should check out this post stackoverflow.com/questions/39131675/is-it-good-practice-to-reference-services-in-html-templates-in-angular-2
Nice and everything but i was looking for a real CRUD tutorial, this video merely showed how to post.. How am i supposed to fill a form before an update?
goo.gl/bPcyXW : Buy me a Coffee.
goo.gl/3VQn29 : Next Part
bit.ly/2KQN9xF : More Angular Tutorials
bit.ly/3Ktqess : MEAN Stack CRUD
bit.ly/47yygKq : (Angular & .Net Core API) Tutorials
13:40 Actual Form designing
Amazing and very usefull!!!
just two comments:
1.- I would recommend you to create an array for all the material (in the matearial module) and pass that array once to import and export. In that case you don't need to duplicate the modules imported.
2.- For the required fields, instead of adding * to the placeholder you can add required to the field which I think is much better. e.g.
thanks for the comment. it'll help me and the viewers in upcoming projects.
Only best and quality material provided.
Very well explained! Thanks
You're welcome!
just love it Man
Very clear and uderstandable. Thanks for the material.
Thank you so much bro😍 very usefull
great one thanks..
excellent video..
Thankyou very much,Great Job mate,i implemented this in my project and its working smoothly.
Excellent, as a noob I learned a lot of things from this video as compared to other videos. Thank You and please continue this work with Get, Post, Put and Delete API
16:05 A private member cannot be accessed from the template when strict mode (Angular 12) is enabled, it should be declared public.
Does this tutorial work fine with angular 12 ???
I used protected and it worked.
@@joaoortega1868 yes that is a major flaw in Javascript. TypeScript when compiled enforces encapsulation but the Javascript result is not. that is why it is not a proper language, honestly.
Thank you so much, very clear tutorial. Appreciate your efforts.
This is a really great instructional video, it really is. It got me off to a flying start. Thank you for your work.
simple but powerful!
Thanks :)
Thank you so much for this awesome tutorial on Form designing using Angular and Firebase. This tutorial has been of immense help to me in achieving my goal. Tutorial was very informative and systematically explained in step by step way. Keep up with this effort of teaching and spreading coding knowledge to everyone!!!!
Excellent as always
Amazing!! Thank you..
your videos are so helpful sir ,can you do video on Curd operations using local storage in angular
Thanks.. very useful
How the deleted data disappeared from mat table? Using Snapshot changes?
Property 'MatToolbarModule' does not exist on type 'typeof import...How to solve this error in material-module.ts
Great tutorial! This example is a good way to start learning angular. I have encountered only two issues:
1. When clearing the form, I got an error in the console because the initialize method from the service was not recognized. Removed the providedIn: 'root' from the @Injectable and it worked;
2. import * as Material from "@angular/material" does not work anymore (angular 9). I had to import each module separately;
for me it is not working Property 'initializeFormGroup' does not exist
on type 'FormGroup'. what to do help !
Great Tutorial, Thanks :)
Please tell me how to solve mat toolbar is not known elements
You are amazing buddy, continue with your videos always!
Thanks for the comment.
How can we achieve this? if the form has been filled by database, I would like to show all the error messages on the form. I dont want to go each one of them and leave the control to show error. Can we achieve this?
Nice Tutorial. Keep it up. !!!!!
Thanks a lot!
This channel is amazing thankss sir
thanks for the kind words.
In your case if u have not entered any data in ur form then also ur submit button is enable. How to disable if user has not entered any data in form?
thank you...
hi sir, i m using angular 10 so my content in toolbar is aligned to left only I made every possible change.
is it applicable for beginners?
With PostgreSQL... how can I do with this but with a form? Angular 7
Nice Tutorial
Hi, On clicking the clear button, the data is getting erased but the error seems to get highlighted for the required fields. How can we remove them after we clear the form. Can you please help.
Hi, how we can do validations for a number field, like that it should contain only whole numbers..if we enter some decimal, or negative integers, it should be validated,..i want this... Kindly help me in this
Nice video Tutorial for Material form design
Thanks for the comment, Hope you will enjoy remaining videos in the series.
Man - your tutorial are fucking Amazing! Congrats!
thanks for your wonderful feedback.
Nice Video Tutorial 👍Can You do One vdo on Inline Editing And Nested datatable
Do you have a tutoriel for user authentication
Yes we do. please try this th-cam.com/video/s2zJ_g-iQvg/w-d-xo.html.
Nice explanation
thanks for the feedback.
Somewhere between this video and the next one in the sequence, the code for populating the Departments changes from a hard-coded list to one that comes from the Firebase database that is created during that next video. However, I'm over half way through the next video and do not see any discussion of how the "departments" table is populated so that it can supplant the previously hard-coded list of departments. How can I populate that Firebase database table so that the code for the next video works properly?
department table is render from firebase collection departments, which is discussed in second video here : th-cam.com/video/hfhlzY3U27M/w-d-xo.html. The firebase collection documents are inserted manually.(Other ways the video will be long one - If you watch this whole series. you create separate form for adding departments ). And then this shows how you can display department records from the firebase collection.
Hello there. Thanks a bunch for the clean Tutorial. I have been using your directions on my personal project. It was god sent. However, I have a serious headache. I put your tutorial directions (heavily modified). However, when using the ROUTERS in angular for some reason view and viewchildren does not wait for any response and especially "MatSort" is not working along with the
codes... Any chance you can direct me for what to do about it?
Is it really related to router guards or something else? Can you check it?
Also there is a possiblity this problem may be also because of the @ViewChild changes in angular version 8?
Thanks
with which programming language you build the back end!
angualr with firebase database. db operations can be done using their api.
We can enter letters in mobile no validation for that
Really good explained. Nice job. Only with me the validation is not working. The error-message doesn't appear
thanks for the comment.please download my demo project and check the same.
ERROR in node_modules/angularfire2/database/interfaces.d.ts(2,26): error TS2307: Cannot find module 'firebase'.
node_modules/angularfire2/firebase.app.module.d.ts(2,79): error TS2307: Cannot find module 'firebase'.
i am using node v 10.14.1
plz give me the suggesation
it is due to latest update in angularfire 2
npm installation command :
npm i --s firebase @angular/fire
try these import statement:
import { AngularFireModule } from '@angular/fire;
import { AngularFireDatabaseModule } from '@angular/fire/database
Hi can you make any video related to host angular crud app in Netlify
not yet.
@@CodAffection can u make video in future?
Thank you so much bro
you are welcome bro :)
I got this msg
Cannot read properties of undefined (reading errors)
What i do sir?
coudn't make the grid responsive, how to do it?
How to open new tab in Angular?
thanks for video...
i use 'mat-selection-list' for filtering my list. But When I checked the my list, after submitting to the server, only the filtered list is displayed and there are no checked filters! And the items that are not checked out after the filter is lost !!! Please cover this topic ...
how about this : stackoverflow.com/a/46749555/4133590
CodAffection tanks. Very helpful... 🙏
Great tutorial, i have an question; where from come the content of application_structure.txt file? or How i can generate his content?
it is something manually typed.
Why are you importing whole material library instead of single modules from library that you are using?
Hi, I cloned the project from GitHub. It shows the following error " Cannot find module '@angular-devkit/build-angular/package.json'". Please help !
Don't just paste project from Download folder. You have to create a new project just by yourself like ng new, and when you create a new project (since angular provides all necessary constructive files), then paste those files form github in that new project you'll be able to use them. You're welcome dude
Hi... I followed all the above steps. But it is throwing an error saying 'Cannot find module '@angular/material' for the line import * as Material from "@angular/material"; . How to resolve it??
you need to add the package in app.modules file
good only but show every changes happens when we create new components
It's showing error in loading angular/material module in material module file.
Can I work with same components and libraries with angular 9 CLI?
Anyone who has insight about this, please share your expertise.
Thank you
Hello... Can we use it with angular 7?
I hope so, let me know if there is any problem.
@@CodAffection hello I am getting error for Mat Grid as mat-grid-title is not a know element
please add video number for each videio to get flow
Great be like other videos.
Good tutorial but mine validations are not working
Hi ,very understandable thanks for that.But i got an error while binding the form with group..why am i getting this...i did the same what you were teaching,,,i got this error
Can't bind to 'FormGroup' since it isn't a known property of 'form'.
1
Hey Saranya did you solve this issue. I am using Angular 10 and following this tutorial but I am stuck with that error. The only solution is to move the service class logic to the component which isn't recommended.
I have a problem with [formGroup] = "service.form" tells me "identifier 'service' refers to a private member of the component" I do not understand, I have everything the same
did you inject service class as per the video ?
Yes, as I said in the video
also download the code and I get the same
Rare, I get the error in visual studio code but everything works.
@@Link2618 I had the same error. Switching the service from private to public fixes it. I also use VS code and after some stack Overflow rabbit holes its aparently better practice when dealing with views to list services as public
I got this error: Property 'service' is private and only accessible within class 'EmployeeComponent'. I need to change to public.
Im using Angular CLI: 9.1.7, Node 12.17.0. Please give me any suggestion
did u get any solution for this?
@@anju199602 yes. U should check out this post stackoverflow.com/questions/39131675/is-it-good-practice-to-reference-services-in-html-templates-in-angular-2
why should u put formgroup in service when u can place it in component ts file? what's advantages someone?
Do you have any github link?
goo.gl/eE5JD9
Nice and everything but i was looking for a real CRUD tutorial, this video merely showed how to post.. How am i supposed to fill a form before an update?
all of them cover in upcoming tutorial.
check the second part : th-cam.com/video/hfhlzY3U27M/w-d-xo.html
MaterialModule has been removed, so following this tutorial will cause many errors. Please update this tutorial.
When next video will release
next video in the series just uploaded now : th-cam.com/video/hfhlzY3U27M/w-d-xo.html
validation is not working.
I am facing so many error
Still not solved
You are too fast, especially when you are switching between files, slow down my friend
Watch this in 1.5x
you sound like Max Verstappen
i think no need to provide Employee Service class in app.module provider in angular 5
required for the features implemented in videos after this video.
Too fast. Looks like 38 mins lecture, it took more than 2 hours and still in 30th min following with implementation with unclear styling
¿and the table?
It's coming.
Malayali
May you please slow down!
By watching this i can say that angular is a mess 🙂
Too fast and cant pick up as I am a beginner 😑
Excellent as always
Excellent as always