Just Subscribed to your channel, Honestly, I do love your skills and how you type in your codes instead of copy and paste-like most tutors, that gives me time to think about what you are doing. Thank you for the video
@@jamesschneider8677 I have a request here. A .NetCore WebAPI, using SQL Server AND calling MSSQL storedprocedures. With angular front end app. Demonstrating - Role based login and logout [generating jWT token, and refreshing it after approx. 60 minutes] and protecting the access of resources based on role[suppose 1 specific page in the app. that will only be accessible by the higher role] Assume 2 roles - Admin, Reader. Possible?
@@ProtikPC_pro_indigo This is an excellent suggestion. I would definitely like to do this. But it has been hard to find time to make a good video lately.
Hi James!. Great video, very clear and concise, thanks for posting it! I added a couple of modifications: 1) In the inspections controller, added the Include method, to show the type name right from the server: // GET: api/Inspections [HttpGet] public async Task GetInspections() { return await _context.Inspections.Include("InspectionType").ToListAsync(); } Then, in the show component: you ca use any of these options: {{ inspectionTypesMap.get(item.inspectionTypeId)}} or {{ item.inspectionType.name }} In order to get this to work, it's necessary to add a line in add-edit-inspection-component.ts: ngOnInit(): void { ... this.inspectionType = this.inspection.inspectionType; ... 2) In the same order of ideas, did this to show the type when editing: in add-edit-inspection-component.html
Thank you for the lesson. I'm looking for good C# tutorials. I've been working with Angular for over a year. In Angular it is very bad to specify types as any. But as for the introduction, the lesson is very well built.
You're welcome. Thanks for the feedback. You're right, it's a best practice to avoid using any for the type if possible because you aren't taking advantage of one of Typescript's strengths and might run into problems later.
Great video ! I'm really glad we've got people like you who share knowledge in such a good way ! Everything is explained when you're not a newbie. Good job. Looking forward for next video !
@@jamesschneider8677 I'd like to improve the project and implement logging in and authentication procedure. What would you choose if you had to do this ? Could you give me a hint how should I start ? This client-server and CORS is something new for me :)
Great idea to keep going with the project to make it better! I'm planning to make a video about this, but I'm not sure how soon it will be. I know it's not always fun to read documentation, but I would start there. docs.microsoft.com/en-us/aspnet/core/security/authentication/identity-api-authorization?view=aspnetcore-6.0
dotnet ef database update (result in an error in my case) At 24:52 if someone has: "A connection was successfully established with the server, but then an error occurred during the login process. (provider: SSL Provider, error: 0 - The certificate chain was issued by an authority that is not trusted.)" The solution is changing the ConnectionString adding TrustServerCertificate=Yes; at the end
I had no idea you can build the table structure in class file and run that migration command. On top of that you ran one step to create your controllers with all the httpget post put etc commands. It was daunting to me to have to hand type all that. It goes to show your efficiency. Thank you as I’m new to all this api building.
22:00 Use dotnet tool install --global dotnet-ef if you are getting error >> dotnet : Could not execute because the specified command or file was not found.
Hi, thanks for taking the time to do this tutorial, it helped a lot for me to practise Angular and .Net, and just for me to have a quick addition to my portfolio. For the editing of the inspection type in app-edit-inspection.component.html, I think this could be used instead of the input: {{ type.inspectionName }} Also, for the show-inspection.component.css, since the selectors are the identical, they could be combined into one: #add-success-alert, #update-success-alert, #delete-success-alert { display: none; animation-name: fadeInAndOut; animation-duration: 4s; }
Hello, Thank you very much, for this video. It was very nice and clear explanation. Can you tell us how to create a dynamic panel dashboard menu which are generated from the database, as well as include dropdown or submenu templates.
Hi. When i try to migrate the database i get this error: An error occurred while accessing the Microsoft Extensions Hosting services. Continuing without the application service provider. Error: Failed to load configuration from file 'C:\Users\user\Downloads\******\******\***\***\***\appsettings.json'. (i have the same connection string)
Ok I cannot figure out why my angular project take/display from my api. The url is right because I can go to that url in the web browser and see json objects. The api works because swagger works on updating the db. the component works because I can display everything until the ngfor for the data. I followed your service creation exactly and I dont know where I went wrong.
Hey thanks for the great tutorial. At around 57 minutes in the video, when I run "ng serve --option", I get the error: Error: src/app/app.module.ts:21:5 - error TS1005: ',' expected. My code matches the code in the video, so not sure what is happening.
Saludos. Normalmente RUclips lo hace automáticamente. No sé por qué no funcionó esta vez. No veo una opción para activarlos. Pero tengo planes para grabarlo en español también.
Sometimes i wish angular and api building had a drag and drop wizard properties to simply it all. Sighs. I’m new to this but it’s so overwhelming, i get to a point where I question if I really want to do this or not. Deep down I do want to learn this but there’s so many moving parts you gotta manually build out and keep track of
Learn VB if you wanna be a lazy programmer. As it is .NET does so much for you already and now you want it to do even more? Maybe you shouldn't program if this is your mentality already?
thank you for your great tutorial ..... but I am working with an older version of visual studio and when I run the code, swagger doesn't open since it needs a subscription and things like this, is there an alternative way to be sure that I made everything right ????? and thank you
Great video. Required your help please...At video - 28.18, I'm getting error running the selected code generator: 'Package restore failed. Rolling back package changes for InspectionAPI". Could someone help me please.
You're welcome! It took a while because I wanted it to be easy to watch and follow along. I didn't measure, but I researched some things and practiced the project a couple of times before recording and then editing. I'm glad you enjoyed it.
Having seen the video, and considering what you say at 37:50, it Would be great if you upload a short video showing how to add routing to a "not-routed" project.
i've got an error 'at 1:36:00, error TS2339: Property 'type' does not exist on type 'AddEditInspectionComponent.' perhaps this is because i'm using angular 14 and i believe there is a difference with strictly typed forms...great video, thanks in advance!
Hello James. Firstly thanks for this course. But i had a problem and i did not found the solution. In 1:03:37 , i had get this error code and i can not see the values on my table. (i can see the headers.) Can't bind to 'ngForOn' since it isn't a known property of 'tr'. My codes like as yours. Thank you, have nice days.
Hi, Thanks for your great tutorial! I was checking your Angular git repo and found it different from your video code. Would you push the Angular project of this video? Also, I was wondering how you are resetting the form showing here 1:57:02?
You're welcome! I'm glad you enjoyed it. I created a new repo. This should be the same one from the video: github.com/james-schneider/angular13-inspection-app - For resetting the form, do you mean after submitting?
@@jamesschneider8677 I've run your both project using VS Code and your projects are absolutely fine and the form resetting is working. Yes, I meant the form reset after submission. How is it happening if you could just explain in your project because I could not find any form reset logic. May be I am missing something. By the way, I've a small fix for you. I was trying to add a colored Bootstrap table header for better UX and need to change the tags like this table>thead>tr> th. Your code is missing the tr before the th and the colored header was not working in app/inspection/show-inspection/show-inspection.component.html So that right table would be
Id Inspection Type Status Comments Options
Another tip for you. Instead of using svg for Bootstrap icons, better using the icon tags for better code readability. Like this npm install --save bootstrap-icons And add follow line to style.css file: @import "~bootstrap-icons/font/bootstrap-icons.css"; And use icons like that(just example):
Thank you for catching that about the table row. And you're right about the readability of the icons versus svg. For the form, every time the modal is opened to add an inspection, the form will be blank because of the modalAdd() method inside show-inspection.component.ts: modalAdd() { this.inspection = { id:0, status:null, comments:null, inspectionTypeId:null } this.modalTitle = "Add Inspection"; this.activateAddEditInspectionComponent = true; }
Thanks! I would like to know how to show the Inspection type text in the select option value instead of showing the number and also set the first inspection type as default in it showing @2:07:37 .
@Disguised Girls, one thing that you can do that I didn't include in the video is make a small change to InspectionsController.cs. Add Include("InspectionType") before ToListAsync(); in the get call. Change that method to look like this: // GET: api/Inspections [HttpGet] public async Task GetInspections() { return await _context.Inspections.Include("InspectionType").ToListAsync(); } This will give you access to the inspectionType (name and id) in the API call instead of just the inspectionTypeId with a null inspectionType. You'll be able to access the inspectionName with inspectionType.inspectionName. Then you can display that in the UI where appropriate. But don't think I would want to show the first inspection type (or name) as a default when you are editing a form (@2:07:37), because then the form could potentially display something that wasn't originally there. For example, if the inspection was originally on the first floor, but the basement is the default option, you could open the form to edit a comment and not change the inspection type back to the original. Or maybe I'm not understanding your question?
Thanks for the video. Can you add role based authentication video where roles are stored in the database. Authenticate using web api and angular. Or can you suggest a method to learn it. Happy new year and all the best
You're welcome. Your video suggestion is on my list. I'll be on the lookout for a good learning resource for you in the meantime. Happy new year to you too.
I just did that in my api. My proposal is to focus on JWT (token) authentication, where you create roles table and user tables in database (you must take care of data context update). Then, for registration a user, you must create a form and POST data to the newly created controller. Afterwards, when logging in procedure is made, token has to be generated (based on credentials send. Email and password e.g.). Token has to be passed back to the fronted where can be stored in local storage of browser. That my proposal ;) it works and there is a lot of tutorials for that way.
Hi, Good video! Am I the only one that the Program.cs file look different than the one in the video? In my program.cs class, I only have the main method and "CreateHostBuilder" method.
I know .net 6 does indeed confuse when u are used to program and startup classes. But even if the versions are different, if u add program and startup file with default settings, you should be able to use them.
this is exactly what i wanted but i cant follow it because i am getting the following error in the migration files: 'DataContext is a name space but it is used like a type' (this line: [DbContext(typeof(DataContext))]) Any ideas?
Hey, sorry to ask this but can someone explain how did the inspectionTypeId got related within the database. Did the Entity Framework did the job behind the scene? Once again I'm sorry for my dumb question hope you can enlighten me.
Yes, Entity Framework Core did this. You can watch the part at 8:08 where I mention that. Entity Framework Core does a lot behind the scenes. This can be good and bad, depending on the use case.
Hi James, Great tutorial. But in getInspections API although we have a foreign key (inspectionTypeId), we are not getting value in inspectionType property (I am getting null). How can we get the inspectionType values also in the same api? (Maybe if we can write some sql queries to join the tables)
Thanks! Yes, there are various ways you can handle that. I added the inspection type in the model as an Entity Framework navigation property to have an easy way to create a foreign key constraint with the inspectionTypeId, and I didn't want to put the inspection type in the Inspections table. That's why it's showing up in the API call as null. You could make it part of the UI (or do it behind scenes) and send that data to the API when creating and updating inspections. That way, when you call getInspections, the inspectionType values would be there instead of showing null. But if you do that, then it would probably make sense to add an additional field in the Inspections table if you want the data to persist there. Writing some SQL to join those tables might accomplish it for you as well. I don't think there is one "right" way to do it.
@Rahul Joshi, if you are still working on this. An easy fix would be to change the the get call in InspectionsController.cs by adding the .Include("InspectionType") before .ToListAsync(); It would look like this: // GET: api/Inspections [HttpGet] public async Task GetInspections() { return await _context.Inspections.Include("InspectionType").ToListAsync(); } Then Inspection Type won't be null
Hi James, when I use ngFor i dont get error but instead of that data from db is not showing , i checked my inspectionApiUrl string which gave me 404, any hint?
Hi, how do I name my default connection string if I do not use sql express but sql server 2019. Is this the right? "DefaultConnection": "server=localhost\\MSSQLSERVER;database=inspectionapidb;trusted_connection=true" Thanks in advance. Great content. You have a new subscriber.
"Server=NAME;Database=DBHERE;Trusted_Connection=True;TrustServerCertificate=Yes;" In my case I've needed TrustServerCertificate=Yes; at the end in order to get things working (NAME -> SELECT @@SERVERNAME )
My "Show Inspection Types" button doesn't launch the modal. I'm using Bootstrap 5 as well but I installed it using NPM as opposed to CDN. Do you know what I'm missing?
@@jamesschneider8677 I don't unfortunately, I've been following your tutorial word for word. I was wondering if I needed to include a click event or something.
@@aricase3826 It sounds like it has to do with NPM. Did you just do NPM install bootstrap, or did you also import the JavaScript? One thing you could try if you haven't already, is to use the CDN. If it works, you'll know something went wrong with the JavaScript bundle and NPM.
Hi James, Thank you and I'm enjoying the lesson but Im kinda stuck with this error on inspect element. could it be I installed a new version of angular? Failed to load resource: net::ERR_CONNECTION_REFUSED :7115/api/inspections:1 ERROR HttpErrorResponse core.mjs:6485 ERROR HttpErrorResponse
I don't speak a lot about it in this particular video, but I do use it with ngModel. I'm planning to make a video about Angular directives, which will include two-way binding.
It feels like the last 40 minutes of the tutorial you just stopped really explaining what you're doing and started mostly reciting the code that you're writing. The whole forms part is very confusing how it ended up working
This is a web API with an Angular front end. Angular is more MVVM than MVC. Here is a site that speaks about web API vs MVC: www.c-sharpcorner.com/UploadFile/2b481f/difference-between-mvc-and-web-api/
@@jamesschneider8677 as long as you have navigation property you can use include(tableName) in the linq query and you can have access to the data with one call
@@NirdeshM - I'm not sure about that one. I don't think I had that error. Are you using .net 6 with all of the dependencies? If so, maybe closing out and opening Visual Studio will help.If that doesn't help, please check the source code to see if we have any differences: github.com/james-schneider/inspection-app-api
People who share thier knowledge are like hero's who save universe...you are one such hero. Thank you very much.
You're welcome!
Just Subscribed to your channel, Honestly, I do love your skills and how you type in your codes instead of copy and paste-like most tutors, that gives me time to think about what you are doing. Thank you for the video
You're welcome. Thanks for the compliment
great video tutorial. James is a very patient instructor who goes through everything. really learned a lot. thank you James
You're welcome!
@@jamesschneider8677
I have a request here. A .NetCore WebAPI, using SQL Server AND calling MSSQL storedprocedures.
With angular front end app. Demonstrating -
Role based login and logout [generating jWT token, and refreshing it after approx. 60 minutes]
and protecting the access of resources based on role[suppose 1 specific page in the app. that will only be accessible by the higher role]
Assume 2 roles - Admin, Reader.
Possible?
@@ProtikPC_pro_indigo This is an excellent suggestion. I would definitely like to do this. But it has been hard to find time to make a good video lately.
@@jamesschneider8677 Ok, when you find some respite, hopefully very soon. Will very eagerly await it from you,
Hi James!. Great video, very clear and concise, thanks for posting it! I added a couple of modifications:
1) In the inspections controller, added the Include method, to show the type name right from the server:
// GET: api/Inspections
[HttpGet]
public async Task GetInspections()
{
return await _context.Inspections.Include("InspectionType").ToListAsync();
}
Then, in the show component: you ca use any of these options:
{{ inspectionTypesMap.get(item.inspectionTypeId)}}
or
{{ item.inspectionType.name }}
In order to get this to work, it's necessary to add a line in add-edit-inspection-component.ts:
ngOnInit(): void {
...
this.inspectionType = this.inspection.inspectionType;
...
2) In the same order of ideas, did this to show the type when editing:
in add-edit-inspection-component.html
Very nice. Thanks for sharing.
Thank you for the lesson. I'm looking for good C# tutorials.
I've been working with Angular for over a year.
In Angular it is very bad to specify types as any.
But as for the introduction, the lesson is very well built.
You're welcome. Thanks for the feedback. You're right, it's a best practice to avoid using any for the type if possible because you aren't taking advantage of one of Typescript's strengths and might run into problems later.
Great video ! I'm really glad we've got people like you who share knowledge in such a good way ! Everything is explained when you're not a newbie. Good job. Looking forward for next video !
@Michal Szura, you're welcome! Thanks for the compliment.
@@jamesschneider8677 I'd like to improve the project and implement logging in and authentication procedure. What would you choose if you had to do this ? Could you give me a hint how should I start ? This client-server and CORS is something new for me :)
Great idea to keep going with the project to make it better! I'm planning to make a video about this, but I'm not sure how soon it will be. I know it's not always fun to read documentation, but I would start there. docs.microsoft.com/en-us/aspnet/core/security/authentication/identity-api-authorization?view=aspnetcore-6.0
At 22:00 the cmd line did not work, because you did benefit from autosave, which is triggered when you start the build within studio...
Thanks, @Norbert Paul Vossiek
congratulations! I haven't looked at a better and clearer coding process in a long time!!! 🥰 a thousand stars for this man! ⭐⭐⭐⭐⭐
Thank you! I'm really glad you enjoyed it. Thanks for the compliment.
Thanks for the video! Clear and Simple!
You're welcome!
dotnet ef database update (result in an error in my case)
At 24:52 if someone has: "A connection was successfully established with the server, but then an error occurred during the login process. (provider: SSL Provider, error: 0 - The certificate chain was issued by an authority that is not trusted.)"
The solution is changing the ConnectionString adding TrustServerCertificate=Yes; at the end
Followed through each second! Great tutorial! Thanks for this
You're welcome!
I had no idea you can build the table structure in class file and run that migration command. On top of that you ran one step to create your controllers with all the httpget post put etc commands. It was daunting to me to have to hand type all that. It goes to show your efficiency. Thank you as I’m new to all this api building.
very very useful, actually this is what i was looking for.
I'm glad to know that.
I want to thank you with all my feelings , really really really thank you
You're welcome!
22:00 Use dotnet tool install --global dotnet-ef if you are getting error >> dotnet : Could not execute because the specified command or file was not found.
u can use this one before InitialCreate method :
dotnet tool install --global dotnet-ef .
thanks
thank you James.. great effort
You're welcome
that was more than amazing your'e saving lives
I'm glad you enjoyed it.
Thanks for this updated tutorial wish you best luck
You're welcome. Thanks for watching.
This was very helpful and enjoyable. You are awesome. God bless you!
amazing tutorial, it came out exactly when I needed it!!
Thanks!
This video is amazing. Thank you.
You're very welcome!
Great concise and to the point project. BTW @24:00 VS didn't do weird thing , James you forgot to build/ save the project .
Thanks for noticing that.
Amazing video! You the best
Thanks, @Taylor Griffin!
Hi, thanks for taking the time to do this tutorial, it helped a lot for me to practise Angular and .Net, and just for me to have a quick addition to my portfolio.
For the editing of the inspection type in app-edit-inspection.component.html, I think this could be used instead of the input:
{{ type.inspectionName }}
Also, for the show-inspection.component.css, since the selectors are the identical, they could be combined into one:
#add-success-alert,
#update-success-alert,
#delete-success-alert {
display: none;
animation-name: fadeInAndOut;
animation-duration: 4s;
}
Thanks for the comment.
Thank you James! this is very helpful video with clear explanations, really learned a lot from this video. thank you very much again! keep it up!!!!
Thank you, AddisInfo! I'm glad it was helpful for you.
Hello,
Thank you very much, for this video.
It was very nice and clear explanation.
Can you tell us how to create a dynamic panel dashboard menu which are generated from the database, as well as include dropdown or submenu templates.
You're welcome. Your suggestion is on my list.
Hi. When i try to migrate the database i get this error: An error occurred while accessing the Microsoft Extensions Hosting services. Continuing without the application service provider. Error: Failed to load configuration from file 'C:\Users\user\Downloads\******\******\***\***\***\appsettings.json'. (i have the same connection string)
Thanks a lot, this tutorial was extremely helpful and awesome!
Edit: I will definitely be watching more of your videos.
Glad it was helpful!
THANKS FOR YOUR VIDEO 👏👏👏👏👏
great tutorial. thanks!
You're welcome!
amazing content I learned so much!!!
So awesome explanation, thanks a lot.
You're welcome!
Thank you for this great course, I really learned alot.
You're welcome!
Ok I cannot figure out why my angular project take/display from my api. The url is right because I can go to that url in the web browser and see json objects. The api works because swagger works on updating the db. the component works because I can display everything until the ngfor for the data. I followed your service creation exactly and I dont know where I went wrong.
Awesome, it is a great video.
I'm glad you liked it!
very nice tutorial! thank very much. just a question: on 01:01:15... was it a fart? o.0
You're welcome. Thanks for watching. I'm not sure what the noise was.
This was very helpful, thank you so much for this great job, you are the best..
You're welcome!
Thank you. it helped me a lot
You're welcome!
Hey thanks for the great tutorial. At around 57 minutes in the video, when I run "ng serve --option", I get the error:
Error: src/app/app.module.ts:21:5 - error TS1005: ',' expected.
My code matches the code in the video, so not sure what is happening.
saludos Mister James, gracias
por el tutorial, seria muy amable de activar los subtitulos
Saludos. Normalmente RUclips lo hace automáticamente. No sé por qué no funcionó esta vez. No veo una opción para activarlos. Pero tengo planes para grabarlo en español también.
@@jamesschneider8677 gracias por sus videos profesor, en español estarian excelentes, saludos
Thanks for sharing the video.
You're welcome.
Great content easy to follow explanation. Thanks man🤗
You're welcome!
This video got me a job!
Congratulations! Thanks for sharing.
Sometimes i wish angular and api building had a drag and drop wizard properties to simply it all. Sighs. I’m new to this but it’s so overwhelming, i get to a point where I question if I really want to do this or not. Deep down I do want to learn this but there’s so many moving parts you gotta manually build out and keep track of
Learn VB if you wanna be a lazy programmer. As it is .NET does so much for you already and now you want it to do even more? Maybe you shouldn't program if this is your mentality already?
@@juleswinnfield9931 What a shitty response. You completely failed to see my point in question. I bet you’re no fun to be around nor work with.
thank you for your great tutorial ..... but I am working with an older version of visual studio and when I run the code, swagger doesn't open since it needs a subscription and things like this, is there an alternative way to be sure that I made everything right ????? and thank you
Great video. Required your help please...At video - 28.18, I'm getting error running the selected code generator: 'Package restore failed. Rolling back package changes for InspectionAPI". Could someone help me please.
great tutorial thanks for all
You're welcome
Thanks, It's really help me.
You're welcome!
Thank you great video! How much time did it take you to create this course?
You're welcome! It took a while because I wanted it to be easy to watch and follow along. I didn't measure, but I researched some things and practiced the project a couple of times before recording and then editing. I'm glad you enjoyed it.
@@jamesschneider8677 yes, thank you for all your time and effort
I am getting error Uncaught TypeError TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" Any help please?
Hello,
Thank you very much, for this video.
Please active subtitle
You're welcome. Sorry, I can't activate the subtitles. It is something that RUclips normally creates automatically, but it did not work in this video.
Having seen the video, and considering what you say at 37:50, it Would be great if you upload a short video showing how to add routing to a "not-routed" project.
I'll try to do that soon.
@Fran Ariza - As requested: ruclips.net/video/9Sv0DVR3C8k/видео.html
Hello Sir, In angular While generating component
Through ng g c compname
Showing nothing to be done.....any suggestions
i've got an error 'at 1:36:00, error TS2339: Property 'type' does not exist on type 'AddEditInspectionComponent.' perhaps this is because i'm using angular 14 and i believe there is a difference with strictly typed forms...great video, thanks in advance!
nevermind! fixed it after proofreading for 2 hours. don't make fun of me!
Glad you figured it out!
@@dougrosenberg2361 how did u fix it? can u share me the solution pls
Hello James. Firstly thanks for this course.
But i had a problem and i did not found the solution.
In 1:03:37 , i had get this error code and i can not see the values on my table. (i can see the headers.)
Can't bind to 'ngForOn' since it isn't a known property of 'tr'.
My codes like as yours.
Thank you, have nice days.
Did you somehow found a solution?
Good work!
Thanks!
Hi,
Thanks for your great tutorial! I was checking your Angular git repo and found it different from your video code. Would you push the Angular project of this video?
Also, I was wondering how you are resetting the form showing here 1:57:02?
You're welcome! I'm glad you enjoyed it. I created a new repo. This should be the same one from the video: github.com/james-schneider/angular13-inspection-app
- For resetting the form, do you mean after submitting?
@@jamesschneider8677 I've run your both project using VS Code and your projects are absolutely fine and the form resetting is working.
Yes, I meant the form reset after submission. How is it happening if you could just explain in your project because I could not find any form reset logic. May be I am missing something.
By the way, I've a small fix for you.
I was trying to add a colored Bootstrap table header for better UX and need to change the tags like this table>thead>tr> th. Your code is missing the tr before the th and the colored header was not working in app/inspection/show-inspection/show-inspection.component.html
So that right table would be
Id
Inspection Type
Status
Comments
Options
Another tip for you. Instead of using svg for Bootstrap icons, better using the icon tags for better code readability. Like this
npm install --save bootstrap-icons
And add follow line to style.css file:
@import "~bootstrap-icons/font/bootstrap-icons.css";
And use icons like that(just example):
Thank you for catching that about the table row. And you're right about the readability of the icons versus svg.
For the form, every time the modal is opened to add an inspection, the form will be blank because of the modalAdd() method inside show-inspection.component.ts:
modalAdd() {
this.inspection = {
id:0,
status:null,
comments:null,
inspectionTypeId:null
}
this.modalTitle = "Add Inspection";
this.activateAddEditInspectionComponent = true;
}
Thanks!
I would like to know how to show the Inspection type text in the select option value instead of showing the number and also set the first inspection type as default in it showing @2:07:37 .
@Disguised Girls, one thing that you can do that I didn't include in the video is make a small change to InspectionsController.cs. Add Include("InspectionType") before ToListAsync(); in the get call. Change that method to look like this:
// GET: api/Inspections
[HttpGet]
public async Task GetInspections()
{
return await _context.Inspections.Include("InspectionType").ToListAsync();
}
This will give you access to the inspectionType (name and id) in the API call instead of just the inspectionTypeId with a null inspectionType. You'll be able to access the inspectionName with inspectionType.inspectionName. Then you can display that in the UI where appropriate. But don't think I would want to show the first inspection type (or name) as a default when you are editing a form (@2:07:37), because then the form could potentially display something that wasn't originally there. For example, if the inspection was originally on the first floor, but the basement is the default option, you could open the form to edit a comment and not change the inspection type back to the original. Or maybe I'm not understanding your question?
Thanks for the video. Can you add role based authentication video where roles are stored in the database. Authenticate using web api and angular. Or can you suggest a method to learn it. Happy new year and all the best
You're welcome. Your video suggestion is on my list. I'll be on the lookout for a good learning resource for you in the meantime. Happy new year to you too.
I just did that in my api. My proposal is to focus on JWT (token) authentication, where you create roles table and user tables in database (you must take care of data context update). Then, for registration a user, you must create a form and POST data to the newly created controller. Afterwards, when logging in procedure is made, token has to be generated (based on credentials send. Email and password e.g.). Token has to be passed back to the fronted where can be stored in local storage of browser. That my proposal ;) it works and there is a lot of tutorials for that way.
@@michaszura8940 can you share if you used any extra study materials like websites
非常感谢！！！
Awesome
Thanks!
Hi, Good video! Am I the only one that the Program.cs file look different than the one in the video? In my program.cs class, I only have the main method and "CreateHostBuilder" method.
You are not using .net 6 most probably 5.
I know .net 6 does indeed confuse when u are used to program and startup classes. But even if the versions are different, if u add program and startup file with default settings, you should be able to use them.
Is it just me?
Close your eyes and imagine you are being taught by MCUs Dr Hulk lol
what color theme do you use during the video?
Anyone has an error on 1:02:00? I get error TS2339: Property 'item' does not exist on type "xComponent". Help please!
this is exactly what i wanted but i cant follow it because i am getting the following error in the migration files:
'DataContext is a name space but it is used like a type' (this line: [DbContext(typeof(DataContext))]) Any ideas?
nvm i fixed it
when click Add inspection shows 400 error pls help to resolve this problem
Hey, sorry to ask this but can someone explain how did the inspectionTypeId got related within the database. Did the Entity Framework did the job behind the scene? Once again I'm sorry for my dumb question hope you can enlighten me.
Yes, Entity Framework Core did this. You can watch the part at 8:08 where I mention that. Entity Framework Core does a lot behind the scenes. This can be good and bad, depending on the use case.
Hi James, Great tutorial.
But in getInspections API although we have a foreign key (inspectionTypeId), we are not getting value in inspectionType property (I am getting null). How can we get the inspectionType values also in the same api? (Maybe if we can write some sql queries to join the tables)
Thanks! Yes, there are various ways you can handle that. I added the inspection type in the model as an Entity Framework navigation property to have an easy way to create a foreign key constraint with the inspectionTypeId, and I didn't want to put the inspection type in the Inspections table. That's why it's showing up in the API call as null. You could make it part of the UI (or do it behind scenes) and send that data to the API when creating and updating inspections. That way, when you call getInspections, the inspectionType values would be there instead of showing null. But if you do that, then it would probably make sense to add an additional field in the Inspections table if you want the data to persist there. Writing some SQL to join those tables might accomplish it for you as well. I don't think there is one "right" way to do it.
@Rahul Joshi, if you are still working on this. An easy fix would be to change the the get call in InspectionsController.cs by adding the .Include("InspectionType") before .ToListAsync(); It would look like this:
// GET: api/Inspections
[HttpGet]
public async Task GetInspections()
{
return await _context.Inspections.Include("InspectionType").ToListAsync();
}
Then Inspection Type won't be null
great video tutorial.
Thank you!
Brother your topic is good....but picture quality is very bad....we are not able read properly....unable to improve the Quality
Thanks for watching. I recorded in HD. Others aren't having the issue you described.
Hi James, when I use ngFor i dont get error but instead of that data from db is not showing , i checked my inspectionApiUrl string which gave me 404, any hint?
CORS error ?
Hi, how do I name my default connection string if I do not use sql express but sql server 2019. Is this the right? "DefaultConnection": "server=localhost\\MSSQLSERVER;database=inspectionapidb;trusted_connection=true" Thanks in advance. Great content. You have a new subscriber.
"Server=NAME;Database=DBHERE;Trusted_Connection=True;TrustServerCertificate=Yes;"
In my case I've needed TrustServerCertificate=Yes; at the end in order to get things working
(NAME -> SELECT @@SERVERNAME )
@@lorenzovarese9024 Thank you Lorenzo 😉
super . sir pleas make tutorial on master detail crud with angular + dotnet core.
Thank you for the request
@@jamesschneider8677 you are super kind. who help the beginner to become pro developer . thank you very much sir
Valeu!
My "Show Inspection Types" button doesn't launch the modal. I'm using Bootstrap 5 as well but I installed it using NPM as opposed to CDN. Do you know what I'm missing?
I'm not sure. Do you have your code hosted anywhere? I could take a look.
@@jamesschneider8677 I don't unfortunately, I've been following your tutorial word for word. I was wondering if I needed to include a click event or something.
@@aricase3826 It sounds like it has to do with NPM. Did you just do NPM install bootstrap, or did you also import the JavaScript? One thing you could try if you haven't already, is to use the CDN. If it works, you'll know something went wrong with the JavaScript bundle and NPM.
Sir Dotnet ef database update
Instance specific error comes
hello sir the update method giving me this id not found error
Thank you for this content.
You're welcome.
Thank you, great tutorial.
You're welcome! Glad you enjoyed it.
nice
Thank you
tks bro!
can we create Models in a separate Model folder?
Hi James, Thank you and I'm enjoying the lesson but Im kinda stuck with this error on inspect element. could it be I installed a new version of angular?
Failed to load resource: net::ERR_CONNECTION_REFUSED :7115/api/inspections:1
ERROR HttpErrorResponse core.mjs:6485 ERROR HttpErrorResponse
please turn on automatic subtitles
I would if I could. RUclips normally does that automatically. I have tried.
What about deployment to IIS 10.0 ? What about Security ?
Thank you for watching. Those are good next steps.
@@jamesschneider8677 Will you be adding videos for those 2 topics ?
Sir my modalEdit not working
Could you please add some subtitles and try to upload with angular 10 & Web api
I can't add subtitles for some reason in this video. I wish I could. RUclips normally does it automatically.
for more videos like that
Thanks for watching.
dotnet ef migrations intialAdd is not working
Can you do a login role based authorization?
I plan to. Finding the time has been the issue.
Does this tutorial cover two way binding?
I don't speak a lot about it in this particular video, but I do use it with ngModel. I'm planning to make a video about Angular directives, which will include two-way binding.
It feels like the last 40 minutes of the tutorial you just stopped really explaining what you're doing and started mostly reciting the code that you're writing. The whole forms part is very confusing how it ended up working
Sorry I am new to coding. Is this MVC pattern?
This is a web API with an Angular front end. Angular is more MVVM than MVC. Here is a site that speaks about web API vs MVC: www.c-sharpcorner.com/UploadFile/2b481f/difference-between-mvc-and-web-api/
life is life la laa - la la la bruh
hi sir, could you please share a link to the github with this project?
.NET Web API: github.com/james-schneider/inspection-app-api
Angular 13 application: github.com/james-schneider/inspection-app
Can you enable subtitles please?
I can't enable them. RUclips usually does it automatically, but it's not working for this video. I wish I could.
😊
webapi doesnt connect to sql
why not send the type name originally from the API and display it instead of the id !!
Because the primary key in one table is a foreign key in another. You can manage your data however you like.
@@jamesschneider8677 as long as you have navigation property you can use include(tableName) in the linq query and you can have access to the data with one call
@@TheNorthRemember Thank you. I will try that.
getting Error Number:67,State:0,Class:20
When did you receive this error?
@@jamesschneider8677 not sure why my reply has been keep on disappearing.
happening when i run dotnet ef database update
@@NirdeshM - I'm not sure about that one. I don't think I had that error. Are you using .net 6 with all of the dependencies? If so, maybe closing out and opening Visual Studio will help.If that doesn't help, please check the source code to see if we have any differences: github.com/james-schneider/inspection-app-api