如何使用angular修改asp.net核心WebAPI的asp.net身份UI [英] How to modify asp.net Identity UI for asp.net core WebAPI with angular
问题描述
几天前我开始学习 .net core，作为开始，我创建了一个带有内置 angular 8 模板的 .netcore 项目.
I started learning .net core a few days ago and as a start, I created a .netcore project with an inbuilt angular 8 templates.
它有几个内置 angular 的页面，比如计数器和获取数据等，但所有与身份相关的页面(登录、注册等)都是作为来自后端的纯 HTML 来的.所以我主要关注的是在该页面中进行一些 UI 更改".
It has a couple of pages built in angular, like counter and fetches data, etc, but all the Identity-related pages (login, registration, etc) are coming as a plain HTML from the backend. So "my main Concern is making some UI changes in that page".
我发现身份已添加到类库中，因此在后端代码中不可见.为了对其进行更改，我需要首先通过脚手架重新生成将其添加到代码中.这将覆盖之前的库代码，并且可以根据需要进行修改.
I found out that the identity has been added to the class library and hence not visible in the backend code. and In order to make changes to it, I will need to first add it to the code by regenerating it through scaffolding. this will override the previous library code and can be modified as per requirement.
所以我选择了添加新的脚手架项目 --> 身份.并在第一次尝试中选择覆盖所有文件"，仅在第二次尝试中选择帐户\登录"和帐户\注册"，并为 dbcontext 选择 applicationdbcontext.但不幸的是，它们都不适合我.
So I selected add new scaffolded item --> identity. and selected "override all files" in first attempt and "account\login" and "account\register" only in the second attempt, and applicationdbcontext for dbcontext. but unfortunately neither worked for me.
当我尝试构建代码时出现此错误
When I try to build the code I get this error
Error CS0246 The type or namespace name 'IWebHostEnvironment' could not be found (are you missing a using directive or an assembly reference?)
C:\Users\MyUserName\source\repos\MyProjectName\obj\Debug\netcoreapp3.0\Razor\Pages\Shared\_Layout.cshtml.g.cs 448
我真的不知道 .g.cs 扩展名是什么，该页面上没有导入语句和一些我以前从未见过的奇怪代码.页面本身也没有显示任何错误/红色标记.
I don't really know what .g.cs extension is, there is no import statement on that page and some weird code that I have never seen before. the page itself also doe's not shown any error/red marking.
我主要想在这里实现两件事，
I basically want to achieve two things here,
1) 完全使用 .net 核心应用程序作为 API，我想为所有与登录相关的东西在 angular 本身中构建 UI，而不是从后端获取 HTML.
1) using .net core app completely as an API, I want to build UI for all the login related stuff in angular itself rather than getting as an HTML from the back-end.
2) 在用户登录表单中添加更多字段.并且由于它是代码优先的方法，因此最终会在用户 DBSet 中进行更改(在这种情况下我不知道该怎么做).
2) adding a few more fields in the user login form. and since it is code first approach then ultimately making changes in users DBSet (which I don't know how to do in this case).
我没有添加任何代码示例，因为它是一种直接的问题/问题.要重现该问题，只需在 .net core 3.0 中创建一个项目并采用 angular 8 模板.现在尝试在登录或注册页面上进行任何与 UI 相关的更改.
I have not added any code sample as it is a kind of straight forward problem/question. to reproduce the issue just create a project in .net core 3.0 and take an angular 8 templates. now try to make any UI related change on login or register page.
推荐答案
很烦人的是，默认项目的布局中不需要这个部分.
尝试删除该导入，带有脚手架 UI 的默认应用程序将正常工作.
It's annoying that this piece which isn't necessary in the layout for a default project lives there.
Try to drop that import and that default app with scaffolded UI will work OK.
我的目的是为登录页面添加一些有点无聊的样式.
My intention was to add some styles for the Login page which is a bit boring.
我做了什么?
+ 使用 Angular 和身份验证(个人用户帐户)模板(来自 Visual Studio 2019)创建了一个 ASP.NET Core Web 应用程序.
+ 添加新的脚手架项目 -> 身份
+ 遵循 ScaffoldingReadme.txt 文件中的步骤(有些步骤已经在正确的位置有片段，不需要任何添加)
+ 从 _Layout.cshtml 页面中删除 @inject IWebHostEnvironment Environment 和 Microsoft.AspNetCore.Hosting 行；
+ 准备看结果:)
What have I done?
+ created an ASP.NET Core web application with Angular and Authentication (Individual User Accounts) template (from Visual Studio 2019).
+ Add New Scaffolded Item -> Identity
+ Followed the steps from ScaffoldingReadme.txt file (some steps have already snippets in the correct place and does not require any additions)
+ Remove the line @inject IWebHostEnvironment Environment and Microsoft.AspNetCore.Hosting from the _Layout.cshtml page;
+ READY to see the RESULT :)
这篇关于如何使用angular修改asp.net核心WebAPI的asp.net身份UI的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
