【移动应用开发技术】ASP.NET中TagHelper如何使用_第1页
【移动应用开发技术】ASP.NET中TagHelper如何使用_第2页
【移动应用开发技术】ASP.NET中TagHelper如何使用_第3页
【移动应用开发技术】ASP.NET中TagHelper如何使用_第4页
【移动应用开发技术】ASP.NET中TagHelper如何使用_第5页
已阅读5页,还剩6页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

【移动应用开发技术】ASP.NET中TagHelper如何使用

在新版的MVC6中,微软提供了强大的TagHelper功能,以便让我们摆脱如下的臃肿代码:@Html.LabelFor(model

=>

model.FullName)

@Html.EditFor(model

=>

model.FullName)

@Html.ValidationMessageFor(model

=>

model.FullName)@addTagHelper

"*,

Microsoft.AspNet.Mvc.TagHelpers"

/*

这里需要首先引用TagHelper所在的命名空间

*/

<label

asp-for="FullName"

class="control-label

col-md-2"></label>

<div

class="col-md-10">

<input

asp-for="FullName"

class="form-control"

/>

<span

asp-validation-for="FullName"></span>

</div>A元素/upload/information/20210522/379/535362.pngForm元素/upload/information/20210522/379/535363.pngInput元素/upload/information/20210522/379/535364.png/upload/information/20210522/379/535366.png/upload/information/20210522/379/535367.pngLabel元素/upload/information/20210522/379/535368.pngtextarea元素/upload/information/20210522/379/535370.pngspan元素/upload/information/20210522/379/535371.pngdiv元素/upload/information/20210522/379/535373.pngselect元素/upload/information/20210522/379/535375.pnglink元素/upload/information/20210522/379/535378.png<link

rel="stylesheet"

href="///ajax/bootstrap-touch-carousel/0.8.0/css/bootstrap-touch-carousel.css"

asp-fallback-href="~/lib/bootstrap-touch-carousel/css/bootstrap-touch-carousel.css"

asp-fallback-test-class="carousel-caption"

asp-fallback-test-property="display"

asp-fallback-test-value="none"

/><link

rel="stylesheet"

href="///ajax/bootstrap-touch-carousel/0.8.0/css/bootstrap-touch-carousel.css"

/>

<meta

name="x-stylesheet-fallback-test"

class="carousel-caption"

/>

<script>

!function

(a,

b,

c)

{

var

d,

e

=

document,

f

=

e.getElementsByTagName("SCRIPT"),

g

=

f[f.length

-

1].previousElementSibling,

h

=

e.defaultView

&&

e.defaultView.getComputedStyle

?

e.defaultView.getComputedStyle(g)

:

g.currentStyle;

if

(h

&&

h[a]

!==

b)

{

for

(d

=

0;

d

<

c.length;

d++)

{

e.write('<link

rel="stylesheet"

href="'

+

c[d]

+

'"/>')

}

}

}("display",

"none",

["\/lib\/bootstrap-touch-carousel\/css\/bootstrap-touch-carousel.css"]);

</script>script元素/upload/information/20210522/379/535379.png<script

src="///ajax/jquery/jquery-1.10.2.min.js"

asp-fallback-src="~/lib/jquery/jquery.min.js"

asp-fallback-test="window.jQuery">

</script><script

src="///ajax/jquery/jquery-1.10.2.min.js">

</script>

<script>(window.jQuery||document.write("<script

src=\"\/lib\/jquery\/jquery.min.js\"><\/script>"));</script>Cache/upload/information/20210522/379/535380.png利用EnvironmentTagHelper来控制不同运行环境的输出结果<environment

names="Development">

<script

src="~/lib/jquery/jquery.js"></script>

<script

src="~/lib/bootstrap/js/bootstrap.js"></script>

<script

src="~/lib/hammer.js/hammer.js"></script>

<script

src="~/lib/bootstrap-touch-carousel/js/bootstrap-touch-carousel.js"></script>

</environment>

<environment

names="Staging,Production">

<script

src="///ajax/jquery/jquery-1.10.2.min.js"

asp-fallback-src="~/lib/jquery/jquery.min.js"

asp-fallback-test="window.jQuery">

</script>

<script

src="///ajax/bootstrap/3.0.0/bootstrap.min.js"

asp-fallback-src="~/lib/bootstrap/js/bootstrap.min.js"

asp-fallback-test="window.jQuery">

</script>

<script

src="///ajax/hammer.js/2.0.4/hammer.min.js"

asp-fallback-src="~/lib/hammer.js/hammer.js"

asp-fallback-test="window.Hammer">

</script>

<script

src="///ajax/bootstrap-touch-carousel/0.8.0/js/bootstrap-touch-carousel.js"

asp-fallback-src="~/lib/bootstrap-touch-carousel/js/bootstrap-touch-carousel.js"

asp-fallback-test="window.Zepto">

</script>

</environment>自定义TagHelperpublic

interface

ITagHelper

{

int

Order

{

get;

}

Task

ProcessAsync(TagHelperContext

context,

TagHelperOutput

output);

}public

interface

ITagHelper

{

int

Order

{

get;

}

Task

ProcessAsync(TagHelperContext

context,

TagHelperOutput

output);

}public

class

ATagHelper

:

TagHelper

{

[Activate]

public

IUrlHelper

UrlHelper

{

get;

set;

}

public

string

Controller

{

get;

set;

}

public

string

Action

{

get;

set;

}

public

override

void

Process(TagHelperContext

context,

TagHelperOutput

output)

{

if

(Controller

!=

null

&&

Action

!=

null)

{

var

methodParameters

=

output.Attributes.ToDictionary(attribute

=>

attribute.Key,

attribute

=>

(object)attribute.Value);

//

删除所有的attributes,因为路由里已经可以自动生成了

output.Attributes.Clear();

output.Attributes["href"]

=

UrlHelper.Action(Action,

Controller,

methodParameters);

output.PreContent.SetContent("My

");

}

}

}public

class

ATagHelper

:

TagHelper

{

[Activate]

public

IUrlHelper

UrlHelper

{

get;

set;

}

public

string

Controller

{

get;

set;

}

public

string

Action

{

get;

set;

}

public

override

void

Process(TagHelperContext

context,

TagHelperOutput

output)

{

if

(Controller

!=

null

&&

Action

!=

null)

{

var

methodParameters

=

output.Attributes.ToDictionary(attribute

=>

attribute.Key,

attribute

=>

(object)attribute.Value);

//

删除所有的attributes,因为路由里已经可以自动生成了

output.Attributes.Clear();

output.Attributes["href"]

=

UrlHelper.Action(Action,

Controller,

methodParameters);

output.PreContent.SetContent("My

");

}

}

}[TargetElement("p")]

public

class

AutoLinkerTagHelper

:

TagHelper

{

public

override

async

Task

ProcessAsync(TagHelperContext

context,

TagHelperOutput

output)

{

var

childContent

=

await

context.GetChildContentAsync();

//

Find

Urls

in

the

content

and

replace

them

with

their

anchor

tag

equivalent.

output.Content.SetContent(Regex.Replace(

childContent.GetContent(),

@"\b(?:https?://|www\.)(\S+)\b",

"$0"));

}

}[TargetElement("p")]

public

class

AutoLinkerTagHelper

:

TagHelper

{

public

override

async

Task

ProcessAsync(TagHelperContext

context,

TagHelperOutput

output)

{

var

childContent

=

await

context.GetChildContentAsync();

//

Find

Urls

in

the

content

and

replace

them

with

their

anchor

tag

equivalent.

output.Content.SetContent(Regex.Replace(

childContent.GetContent(),

@"\b(?:https?://|www\.)(\S+)\b",

"$0"));

}

@Model.CopyrightYear

-

My

ASP.NET

Application©

@Model.CopyrightYear

-

My

ASP.NET

Application[TargetElement("div")]

[TargetElement("style")]

[TargetElement("p")]

public

class

ConditionTagHelper

:

TagHelper

{

public

bool?

Condition

{

get;

set;

}

public

override

void

Process(TagHelperContext

context,

TagHelperOutput

output)

{

//

如果设置了condition,并且该值为false,则不渲染该元素

if

(Condition.HasValue

&&

!Condition.Value)

{

output.SuppressOutput();

}

}

}4.自定义元素的TagHelperpublic

class

WebsiteInformationTagHelper

:

TagHelper

{

public

WebsiteContext

Info

{

get;

set;

}

public

override

void

Process(TagHelperContext

context,

TagHelperOutput

output)

{

output.TagName

=

"section";

output.PostContent.SetContent(string.Format(

"

Version:

{0}

"

+

Environment.NewLine

+

"

Copyright

Year:

{1}

"

+

Environment.NewLine

+

"

Approved:

{2}

"

+

Environment.NewLine

+

"

Number

of

tags

to

show:

{3}

"

+

Environment.NewLine,

Info.Version.ToString(),

Info.CopyrightYear.ToString(),

Info.Approved.ToString(),

Info.TagsToShow.ToString()));

output.SelfClosing

=

false;

}

}public

class

WebsiteInformationTagHelper

:

TagHelper

{

public

WebsiteContext

Info

{

get;

set;

}

public

overr

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论