Question

我有一个基本的密码强度指示器。

<input type="password" id="myElement1" size="40" class="left" data-display="myDisplayElement1" />
<div class="left" id="myDisplayElement1"></div>

我有JS Script来处理所有逻辑。并且data-display div显示密码是弱还是强的消息。但我想将上面的代码转换成Razor。以下就是我现在所拥有的。

<div class="form-group">
    @Html.LabelFor(model => model.NewPassword, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.EditorFor(model => model.NewPassword, new { htmlAttributes = new { @class = "form-control", id = "myElement1" } })
        <div class="left" id="myDisplayElement1"></div>
        @Html.ValidationMessageFor(model => model.NewPassword, "", new { @class = "text-danger" })
    </div>
</div>

问题：一切正常，但我无法将数据显示属性放在剃须刀中。我需要在哪里放置它。但由于未设置数据显示，我无法将用户的密码强度显示为div。

我希望能够做类似下面的事情

 @Html.EditorFor(model => model.NewPassword, new { htmlAttributes = new { @class = "form-control", id = "myElement1" , data-display = "myDisplayElement1"} })

但是data-display给了我错误。

错误

无法解析符号data错误来自我添加data-display的地方。

Answer 1

连字符在匿名对象中无效。但是，知道有时需要添加带连字符的属性，Razor助手会自动用属性名称中的连字符替换下划线。因此，您可以使用data_display而不是data-display来完成所需工作。

如何在剃须刀中设置数据显示

1 个答案: