彩票走势图

DevExpress DXTREME使用教程:如何在应用程序中进行视图设置

原创|使用教程|编辑:郝浩|2013-03-18 13:37:25.000|阅读 703 次

概述:DXTREME HTML JS 框架生成的应用程序是一个单页面应用程序,虽然这样的应用程序只有一个 web 页,它可以包含定义为命名视图的多个应用程序屏幕。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

    DXTREME ENTERPRISE HTML JS 框架生成的应用程序是一个单页面应用程序,虽然这样的应用程序只有一个 web 页,它可以包含定义为命名视图的多个应用程序屏幕。在Web浏览器中的应用程序,一个视图的名字被编码到应用程序URL的片段标识符上。

    通过一块窗体视图模板的 HTML 标记定义该视图,这个视图可以由JavaScript代码选择,或是用一个关联的样式表自定义外观和风格。

    在默认的情况下,框架使用KnockoutJS绑定数据到视图模版,关联的JavaScript代码准备 ViewModel,并执行设置视图所需的额外操作。这些操作包括与 web 服务器和后续呈现的视图互动。

    若要创建一个视图,使用一个 div 元素来查看标记,设置元素的关于视图的data-dx-role,分配视图名称到data-dx-name属性。

<div data-dx-role="view" data-dx-name="index">
 <h1 data-bind="text: message"></h1> 
</div>

    为了声明视图的一个ViewModel,在你的应用程序命名空间上用视图名称声明一个功能。这是通过 ns 配置对象传递给 HtmlApplication 构造函数的参数指定的命名空间。

MyApp.index = function(params) {
  return
  {
     message: "Hello World!"
   };
 };

    你可以通过声明数据属性,来从关联标记中扩展ViewModel。例如,在下面的代码段中,将使用Home Screen值,运行时在索引视图模型中创建一个标题属性。

<div data-dx-role="view" data-dx-name="index" data-dx-title="Home Screen">
 <h1 data-bind="text: message"></h1> 
</div>




标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn

文章转载自:慧都控件

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP