Question

我有一个MVC项目，它使用共享布局在所有页面的顶部和左侧呈现菜单。我有一个页面，显示非活动用户的消息。我想以完全相同的布局显示此消息与所有菜单，但菜单应禁用，用户无法点击它们。我可以用什么？有什么像TagHelper我可以在这里使用吗？

这是布局中的代码，显示带有链接的菜单：

  !-- TOP NAVIGATION -->
 <div id="top-nav" class="span_12 section">
 <div class="span_10 content group">
    <a href="loginView.html" class="span_4 col cf-logo"><img src="~/content/images/logo.png"></a>
    <ul class="right">
        <li class="colWrap">
            <a href="@Url.Action("Dashboard","Home")" class="dashboard-view"><span class="icon-dash"></span>dashboard</a>
        </li>
        <li class="colWrap">
            <!-- if there are document alerts -->
            <span class="icon-alert-13"></span>
            <!-- end if -->
            <a href="@Url.Action("Document","Document")" class="documents-view"><span class="icon-docs"></span>documents</a>
        </li>
        <li class="colWrap">
            <a href="@Url.Action("HelpCenterIndex","HelpCenter")" class="helpcenter-view"><span class="icon-help"></span>help center</a>
        </li>
    </ul>
</div>
 </div>
 <!-- LEFT SIDE NAVIGATION -->
  <div id="left-nav" class="span_1 section">
<ul id="nav-icons" class="span_12 section">
    <li class="span_12 colWrap">
        <a href="@Url.Action("Dashboard","Home")" class="dashboard-view">
            <span class="icon-dash"></span>
            Dashboard
        </a>
    </li>
    <li class="span_12 colWrap">
        <a href="@Url.Action("Document","Document")" class="documents-view">
            <span class="icon-docs"></span>
            Documents
        </a>
    </li>
    <li class="span_12 colWrap">
        <a href="@Url.Action("HelpCenterIndex","HelpCenter")" class="helpcenter-view">
            <span class="icon-help"></span>
            Help Center
        </a>
    </li>
</ul>

Answer 1

嗯，你可以随时自己实施，不是吗？它看起来像这样：

[HtmlTargetElement("a", Attributes = "is-disabled")]
public class DisableLinkTagHelper : TagHelper
{
    [HtmlAttributeName("is-disabled")]
    public bool Disabled { get; set; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        if (Disabled)
        {
            output.Attributes.RemoveAll("href");
        }
    }
}

将其导入视图中，如下所示：

@addTagHelper "*, {Name of your assembly}"

并使用它：

 <a is-disabled="true" href="@Url.Action("Dashboard","Home")" class="dashboard-view">
      <span class="icon-dash"></span>dashboard
 </a>

你可以瞥见docs about tag helpers它需要几分钟才能掌握...

修改

在MVC 5中，您可以使用@helper - s，它们基本上是html返回函数。您可以这样声明：

@helper RenderMenuLink(string url, string cssClass, string icon, string text, bool enabled) { var href = ""; if (enabled) { href = string.Format("href=\"{0}\"", url); } <a @href class="@cssClass"> <span class="@icon"></span> @text </a> }

并称之为您可以调用常规函数：

@RenderMenuLink(Url.Action("Dashboard","Home"), "dashboard-view", "icon-dash", "dashboard", false)

Answer 2

为什么需要TagHelper？您始终可以在View上检查您的用户，而不是将<a>标记与href一起放在View上的文字：

<li class="span_12 colWrap">
    @if(Context.User.Identity.IsAuthenticated) //or any other way how you check user is active
    {
        <a href="@Url.Action("Dashboard","Home")" class="dashboard-view">
           <span class="icon-dash"></span>
           Dashboard
        </a>
    }
    else
    {
        <a class="dashboard-view">
           <span class="icon-dash"></span>
           Dashboard
        </a>        
    }
</li>

禁用MVC中共享视图的链接

2 个答案: