页面建模

本文介绍了一种前端页面的建模方法,通过在view/xx.xml中使用WebDSL进行建模,然后利用moqiu和freemarker将DSL转化为AngularJS模板,最后开发组件并解析模板,实现页面动态生成。

前端页面建模

1 先在view/xx.xml里面用WebDSL建模

<services>

   <service name="name1" type="entity"  entity-name="entity1">

      <method type="get" method="getList"></method>

  </service>

   <service name="name2" type="custom" namespace="space1">

      <method type="get" method="geTreeList"></method>

  </service>

 <service></service>

</services>

 

<datasources>

<datasource name="source1"></datasource>

<datasource name="tableData"></datasource>

</datasources>

 

<actions>

   <action name="createTask" service="service1" operation="get">

      <params>

         <param name="name1" value="${itmtree.selectNodeId}"></param>

   </params>

  <response status="success" type="action"  tartget="refreshTable"></response>

</action>

 <action name="refreshTable" operation="getList" serviece="service1">

  <param name="id" value="${tableName.row.id}"></param>

 

<response status="success" type="data-transfer" tartget="tableData"></response>

</action>

<action name="pre-step" type="instance-method" instance="steId"></action>

<actions>

<table id="table1" datasoure="tableData" action="refreshTable">

   <table-col  label="clo1"></table-col>

<table-col  label="clo2"></table-col>

</table>

 

<steps id="stepId">

   <step label="label1"></step>

<step label="label2"></step>

</steps>

  <layout show="${stepId.index===1}">

     //content1

</layout>

  <layout show="${stepId.index===2}">

     //content2

</layout>

<button text="next" onClick="next-step" show="${stepId.index!===3}"></button>

<button text="pre" onClick="pre-step" show="${stepId.index!===1}"></button>

<button text="OK" onClick="ok" show="${stepId.index!===3}"></button>

 

2 基于moqiu+freemarker 解析DSL,转化成angularjs模板

3 用angularjs开发组件,解析第二步中的模板

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值