【1】 调式qweb模板时, 可以脱离openerp环境
阅读一下openerp目录 qweb目录中的几个html文件,可以作为起步
在浏览器下, 可以这样运行这些文件
http://127.0.0.1:8069/web/static/lib/qweb/qweb-benchmark.html
http://127.0.0.1:8069/web/static/lib/qweb/qweb-test.js.html
【2】qweb模板的格式如果不符合xml规范, 浏览器显示空白, 浏览器的控制台中会显示如下提示
Uncaught Error: QWeb2: This page contains the following errors:error on line xxx at column yyy:
然后是具体的错误原因。比如
Opening and ending tag mismatch: aaa line nnn and bbb
Specification mandate value for attribute ccc
【3】在模板中增加如下指令, 可在浏览器的控制台上输出变量内容
〈t t-log="变量名称" />
当使用多个t-log时, 控制台中输出的变量内容会引起混淆, 这时可再增加如下语句
〈t t-log=" '变量名称的说明' " />
【4】在模板中增加如下指令, 可在qweb的编译模板过程中进入断点语句,
〈t t-debug="随便什么东东" />
这时, 我们可以在控制台的源码页签中看到编译的中间过程,
在控制台下, 使用console.log(dict) 可以看到传入的所有参数
使用console.log(r) 可以看到输出中间结果
官方文档上 介绍的使用方法 〈t t-debug /> ,如果后面不随便添加些什么东东, 会出现如下错误
Specification mandate value for attribute t-debug
【5】模板文件示例 (在qweb目录下, 文件名为 laoliu.xml)
如下是官网上web文档中的例子, 增加了t-log和t-debug语句
〈templates> 〈div t-name="example_template" t-attf-class="base #{cls}"> 〈t t-log="'in example_template, value of [items]:'" /> 〈t t-log="items" /> 〈h4 t-if="title"> 〈t t-esc="title"/> 〈/h4> 〈ul> 〈li t-foreach="items" t-as="item" t-att-class="item_parity"> 〈t t-call="example_template.sub"> 〈t t-set="arg" t-value="item_value"/> 〈/t> 〈/li> 〈/ul> 〈t t-debug="随便什么东东" /> 〈/div> 〈t t-name="example_template.sub"> 〈t t-log="'in example_template.sub, value of [arg]:'" /> 〈t t-log="arg" /> 〈t t-esc="arg.name"/> 〈dl> 〈t t-foreach="arg.tags" t-as="tag" t-if="tag_index lt 5"> 〈dt> 〈t t-esc="tag"/> 〈/dt> 〈dd> 〈t t-esc="tag_value"/> 〈/dd> 〈/t> 〈/dl> 〈/t> 〈/templates>
【6】 程序示例 (在qweb目录下, 文件名为 laoliu.html)
访问方法:http://127.0.0.1:8069/web/static/lib/qweb/laoliu.html
〈!doctype html> 〈html> 〈head> 〈script src="../jquery/jquery-1.8.3.js"> 〈/script> 〈script type="text/javascript" src="qweb2.js"> 〈/script> 〈script> var laoliu_data={ "class1": "foo", "title": "Random Title", "items": [ { "name": "foo", "tags": {"bar": "baz", "qux": "quux"} }, { "name": "Lorem", "tags": { "ipsum": "dolor", "sit": "amet", "consectetur": "adipiscing", "elit": "Sed", "hendrerit": "ullamcorper", "ante": "id", "vestibulum": "Lorem", "ipsum": "dolor", "sit": "amet" } } ] }; QWeb = new QWeb2.Engine(); QWeb.debug = true; QWeb.add_template('laoliu.xml'); template='laoliu.xml'; result=QWeb.render('example_template', laoliu_data ); $(document).ready(function () { $('.placeholder').append(result); }); 〈/script> 〈/head> 〈body> 〈div class="placeholder"> 〈/div> 〈/body> 〈/html>
【7】t-debug的运行结果
(function(dict ) { var context = { engine : this, template : 'example_template' }; dict = dict || {}; dict['__template__'] = 'example_template'; var r = []; r.push(' 〈div'); r.push(context.engine.tools.gen_attribute(['class', ('base ' + (dict['cls']))])); r.push('> ', 'n '); console.log('in example_template, value of [items]:'); r.push('n '); console.log(dict['items']); r.push('n '); if (dict['title']) { r.push(' 〈h4> '); r.push(context.engine.tools.html_escape(dict['title'])); r.push(' 〈/h4> '); } r.push('n 〈ul> ', 'n '); context.engine.tools.foreach(context, dict['items'], 'item', dict, function(context, dict) { r.push(' 〈li'); r.push(context.engine.tools.gen_attribute(['class', (dict['item_parity'])])); r.push('> ', 'n '); r.push(context.engine.tools.call(context, 'example_template.sub', dict, '', function(context, dict) { var r = []; r.push('n '); dict['arg'] = (dict['item_value']); r.push('n '); return r.join(''); })); r.push('n 〈/li> '); }); r.push('n 〈/ul> ', 'n '); debugger; r.push('n 〈/div> '); return r.join(''); })