TagHelper 中使用 ViewBag 及其他

自定義一個 TagHelper       ViewContext 引用的空間 using Microsoft.AspNetCore.Mvc.Rendering;

   [HtmlTargetElement("card")]
    public class CardTagHelper: TagHelper
    {
        public string Title { get; set; }
        public string Icon { get; set; }
        public string Url { get; set; }
        public string Tag { get; set; }

        [HtmlAttributeNotBound]
        [ViewContext]
        public ViewContext viewContext { get; set; }

        IWorkOrderService workOrderService;
        public   CardTagHelper(IWorkOrderService workOrderService)
        {
            this.workOrderService = workOrderService;
        }

        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            output.TagName = Tag??"div";
            output.TagMode = TagMode.StartTagAndEndTag;

            
            var preContent = new StringBuilder();
            preContent.Append("<a>test</a>");
            viewContext.ViewBag.zhangsan = Title;
            int count = 0;
            var list = workOrderService.PageFind(0, null, null, null, null, null, 0, 1, 10, out count);
            viewContext.ViewBag.list = list;
            viewContext.ViewBag.count = count;

            output.PreContent.SetHtmlContent(preContent.ToString());
            output.PreContent.SetContent(Icon);
        }
    }

 Microsoft.AspNetCore.Mvc 中也有一個 ViewContext ,注意不要引用錯

 

前端的寫法
引入名稱和所在程序集
@addTagHelper  CooperAdmin.CardTagHelper,CooperAdmin

這裏嵌套調用
<card title="myTitle" icon="myIcon" url="redirectUrl">
    @ViewBag.zhangsan
    <ul>
        @foreach (var li in ViewBag.list)
        {
            <li>@li.Id, @li.Name</li>
        }
    </ul>


    <card title="myTitle2" icon="myIcon2" url="redirectUrl2">
    </card>
</card>

 

 

生成的代碼:

<div>myIcon
    myTitle
    <ul>
            <li>6643, 蒼茫的天涯是我的愛</li>
            <li>6642, 蒼茫的天涯是我的愛</li>
            <li>6641, 蒼茫的天涯是我的愛</li>
            <li>6640, 蒼茫的天涯是我的愛</li>
            <li>6639, 蒼茫的天涯是我的愛</li>
            <li>6638, 蒼茫的天涯是我的愛</li>
            <li>6637, 蒼茫的天涯是我的愛</li>
            <li>6636, 動可愛的人</li>
            <li>6635, 動的收</li>
            <li>6634, 動的收</li>
    </ul>


    <div>myIcon2
    </div>
</div>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章