首頁猿問將 ModelExpression...

將 ModelExpression 從 Tag Helper 傳遞到分部視圖

C#

手掌心 2022-11-21 15:59:54

我正在使用此處找到的示例來允許從標(biāo)簽助手中呈現(xiàn)局部視圖。我在這里要做的是能夠像這樣定義一個(gè)標(biāo)簽助手：<mydateinput for="@Model.StartDate" />在標(biāo)簽助手的 c# 代碼中，我定義了“for”屬性，據(jù)我所知，這需要定義為“ModelExpression”。public class MyDateInputTagHelper : TagHelper{ public ModelExpression For { get; set; } ...}使用本文前面提到的代碼，我正在渲染一個(gè)局部視圖，并簡(jiǎn)單地將標(biāo)簽助手的類作為局部視圖的模型傳遞。 public override void Process(TagHelperContext context, TagHelperOutput output) { base.Process(context, output); ((IViewContextAware)HtmlHelper).Contextualize(ViewContext); output.Content.SetHtmlContent(HtmlHelper.Partial("~/Views/Partials/TagHelpers/MyDateInput.cshtml", this)); }最后，我的局部視圖定義如下<input asp-for="For" />我遇到的問題是我無法讓模型表達(dá)式“For”正確傳遞到局部視圖中。當(dāng)我查看 html 源代碼時(shí)，我只是在輸入的 id 和名稱屬性中看到字面上的名稱“For”。此外，在我的剃刀頁面模型中設(shè)置的值也沒有正確顯示。我想要發(fā)生的是 html 將以這樣一種方式呈現(xiàn)，即在發(fā)布頁面時(shí)，我的剃須刀頁面的模型將填充在標(biāo)簽助手/部分視圖下選擇的值。它會(huì)特別圍繞“StartDate”（在我的示例中），而不是屬性“For”。有誰知道我做錯(cuò)了什么，以及我可以在此示例中更改哪些內(nèi)容以正確地將 ModelExpression 傳遞給局部視圖？

查看完整描述

2 回答

揚(yáng)帆大魚

TA貢獻(xiàn)1799條經(jīng)驗(yàn) 獲得超9個(gè)贊

直接使用是不可能做到這一點(diǎn)的InputTagHelper。有關(guān)詳細(xì)信息，請(qǐng)參閱Razor/issues #926以及關(guān)于 SO 的類似問題。

解決方法

但作為一種解決方法，您可以使用自定義HtmlHelper<TModel>（就像@Html）來實(shí)現(xiàn)相同的目標(biāo)。您的部分視圖可能如下所示：

@model App.TagHelpers.PartialVM

@{

var PartialHtml = Model.HtmlHelper;

}

@PartialHtml.Label(Model.NewFor.Name,Model.NewFor.Name)

@PartialHtml.TextBox(Model.NewFor.Name, Model.NewModel)

即，使用@Html.Label()&@Html.TextBot而不是<label>& <input>。

這PartialVM是一個(gè)簡(jiǎn)單的類，其中包含有關(guān)模型的元信息：

public class PartialVM

{

public PartialVM(ModelExpression originalFor, IHtmlHelper htmlHelper)

{

var originalExplorer = originalFor.ModelExplorer;

OriginalFor = originalFor;

OriginalExplorer = originalExplorer;

NewModel = originalExplorer.Model;

NewModelExplorer = originalExplorer.GetExplorerForModel(NewModel);

NewFor = new ModelExpression(OriginalFor.Name, NewModelExplorer);

this.HtmlHelper = htmlHelper;

}

public IHtmlHelper HtmlHelper { get; set; }

public ModelExpression OriginalFor { get; set; }

public ModelExplorer OriginalExplorer { get; set; }

public ModelExpression NewFor { get; set; }

public ModelExplorer NewModelExplorer { get; set; }

public Object NewModel { get; set; }

}

請(qǐng)注意，IHtmlHelper實(shí)際上是 anIHtmlHelper<TSomeDynamicModel>而不是普通的IHtmlHelper。

最后，將您的更改TagHelper如下：

[HtmlTargetElement("my-custom-input")]

public class MyCustomInputTagHelper : TagHelper

{

private readonly IServiceProvider _sp;

[ViewContext]

public ViewContext ViewContext { set; get; }

public ModelExpression For { get; set; }

public MyCustomInputTagHelper(IServiceProvider sp)

{

this._sp = sp;

}

public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)

{

base.Process(context, output);

var originExplorer = For.ModelExplorer;

var newModel = originExplorer.Model;

var newExplorer = originExplorer.GetExplorerForModel(newModel);

var newFor = new ModelExpression(For.Name, newExplorer);

var ModelType = originExplorer.Container.Model.GetType();

var htmlHelperType = typeof(IHtmlHelper<>).MakeGenericType(ModelType);

var htmlHelper = this._sp.GetService(htmlHelperType) as IHtmlHelper; // get the actual IHtmlHelper<TModel>

(htmlHelper as IViewContextAware).Contextualize(ViewContext);

var vm = new PartialVM(For, htmlHelper);

var writer = new StringWriter();

var content = await htmlHelper.PartialAsync("~/Views/Partials/TagHelpers/MyDateInput.cshtml", vm);

output.TagName = "div";

output.TagMode = TagMode.StartTagAndEndTag;

output.Content.SetHtmlContent(content);

}

現(xiàn)在您可以為的屬性傳遞任何asp-for表達(dá)式字符串，它應(yīng)該會(huì)按預(yù)期工作。ForTagHelper

測(cè)試用例：

假設(shè)我們有一個(gè) Dto 模型：

public class XModel {

public int Id { get; set; }

public DateTime StartDate { get; set; }

public DateTime EndDate { get; set; }

public string ActiveStatus{ get; set; }

}

您可以通過以下方式呈現(xiàn)它：

/// the action method looks like:

/// var model = new XModel {

/// StartDate = DateTime.Now,

/// EndDate = DateTime.Now.AddYears(1),

/// ActiveStatus = "Active",

/// };

/// return View(model);

@model XModel

<my-custom-input For="StartDate" />

<my-custom-input For="EndDate" />

<my-custom-input For="ActiveStatus" />

這是渲染時(shí)的屏幕截圖：

反對(duì) 回復(fù) 2022-11-21

嗶嗶one

TA貢獻(xiàn)1854條經(jīng)驗(yàn) 獲得超8個(gè)贊

或者在您的部分中使用 Html Helpers，然后它將起作用。

// _MovieField.cshtml

@{

string propertyName = (string)ViewData["PropertyName"];

}

@Html.Label(propertyName, null, new{ @class = "control-label" })

@Html.Editor(propertyName, new { htmlAttributes = new { @class = "form-control" } })

@Html.ValidationMessage(propertyName, null, new{ @class = "text-danger" })

</div>

并像這樣使用它

// EditMovie.cshtml