在导航栏中插入模式剃须刀页面.怎么做? [英] Insert a modal razor page in the navbar. How to do it?
问题描述
我正在建立一个新网站,其中一项要求是使登录表单成为模式窗口.我试图将其包含在顶部导航栏中,并且仅当用户未登录时才呈现它.
I'm building a new website and one of the requirements is to have the login form be a modal window. I'm trying to include it in the top navigation bar and it's only being rendered if the user is not logged in.
如何在顶部导航栏中添加具有自己的模型的模态窗口?有其他选择吗?
How can I add this modal window with it's own model inside the top navbar? Are there any alternatives?
如果我删除模型并让一个空的模态一切正常,但是当我再次添加它时,它不起作用,因为页面的模型(在本例中是索引页面)是一个与之不同的模型.模态登录.
If I delete the model and let an empty modal everything works perfectly but when I add it again it doesn't work, because the model of the page (in this case the index page) is a different one then the one from the modal login.
P.S.我正在使用Razor Pages和ASP.NET Core 2.2.
P.S. I'm using Razor Pages and ASP.NET Core 2.2.
推荐答案
部分视图
因此,您创建了一个_LoginPartial.cshtml
文件.假设您设置了@model LoginViewModel
So you make a _LoginPartial.cshtml
file. and let's say you set @model LoginViewModel
在此_LoginPartial.cshtml
内,您具有登录模式和所有功能.
Inside this _LoginPartial.cshtml
you have your Login Modal and all the functionality.
现在,当您在具有模型@model AnotherModel
的Index
页面中调用部分时,您需要像这样将新模型传递给部分:
Now when you invoke your partial inside an Index
page that has model @model AnotherModel
, you need to pass a new model to the partial like so:
<partial name="_LoginPartial" model='new LoginViewModel()' />
name
是您的cshtml
页面的名称.
model
是页面的@model
.
查看组件
简而言之,如果您采用这种方式,这本质上就像是在页面内嵌套一个小控制器.允许您更改@model
的范围.
To be brief if you take this route this is essentially like nesting a little controller inside your page. Allowing you to change scope for your @model
.
更新嵌套对象
您需要实例化对象属性.
You need to instantiate the object property.
<partial name="_LoginPartial"
model='new LoginViewModel { InputModel = new InputModel() }' />
<partial name="_LoginPartial"
model='new LoginViewModel { InputModel = new InputModel() }' />
这篇关于在导航栏中插入模式剃须刀页面.怎么做?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!