MVC6 TagHelpers 随着ComponentOne Studio 2015 V2版本一起发布了,所以您现在就可以使用它的新功能了。
TagHelpers和web指令很相似,例如JavaScript脚本里的Angular扩展了HTML属性,这和ASPNET5很相似。现在可以使用HTML帮助器来简化扩展语义标记。例如,参考下面的情景:
在ASPNET MVC中使用FlexGrid ,当前我们使用的razor 语法如下:
@(Html.C1().FlexGrid()
.AutoGenerateColumns(false)
.CssClass("grid")
.IsReadOnly(true)
.Columns(columns =>
{
columns.Add(column => column.Binding("Start").Width("80").MaxWidth(160).MinWidth(40));
columns.Add(column => column.Binding("Product").Width("2*").AllowResizing(false));
columns.Add(column => column.Binding("Amount").Format("c"));
columns.Add(column => column.Binding("Amount2").Format("c"));
})
.Bind(Model)
)
现在来看下使用Taghelpers 后的句法:
<c1-flex-grid class="grid" auto-generate-columns="false" is-read-only="true">
<c1-flex-grid-column binding="Start" width="80" max-width="160" min-width="40"></c1-flex-grid-column>
<c1-flex-grid-column binding="Product" width="2*" allow-resizing="false"></c1-flex-grid-column>
<c1-flex-grid-column binding="Amount" format="c"></c1-flex-grid-column>
<c1-flex-grid-column binding="Amount2" format="c"></c1-flex-grid-column>
<c1-items-source read-action-url="@Url.Action("StarSizing_Bind")"></c1-items-source>
</c1-flex-grid>
上面的代码看起来像使用了标记语言。这就是TagHelpers 优秀之处:简洁且便于理解。加上它对完整的IntelliSense的支持,编写razor代码就变得十分轻松愉快。我们来看看使用了模板的其他例子。假如我们需要显示下拉框自定义项目,可以编写如下razor代码:
@(Html.C1().ComboBox()
.Bind(Model)
.DisplayMemberPath("Name")
.SelectedValuePath("Value")
.ItemTemplateId("template1")
在“template1”分别定义为:
<script id="template1" type="text/template">// <![CDATA[
<span>
<span class="palette" style="background-color: {{Value}}"></span>
<span class="label">{{Name}}</span>
</span>
// ]]></script>
同样的代码使用Taghelpers后将会如下所示:
<c1-combo-box display-member-path="Name" selected-value-path="Value">
<c1-input-item-template>
<span>
<span class="palette" style="background-color: {{Name}}"></span>
<span class="label">{{Name}}</span>
</span>
</c1-input-item-template>
<c1-items-source source-collection="@Model"></c1-items-source>
</c1-combo-box>
正如我们看到的那样,只需几行代码,模板定义就内联且自然。从2015 V2版本开始我们的所有MVC版控件都支持TagHelper。ASPNET5中的控件的核心是CLR,因此,控件能够跨平台工作。
2015 v2发布后,MVC版本控件兼容了MVC6和TagHelpers Beta版。微软发布ASPNET5 RC\RTM后,我们很快也会让这些控件和ASPNET5 RTM兼容。
敬请期待更多喜讯
2015 v2发布后,MVC版FlexChart 中的TrendLines, RangeSelector 以及新版本的Web API您就可以开始使用了。
GCDN:http://gcdn.grapecity.com.cn/
官方网站:/developer