NodeBB/nodebb-chinese-simplified
2
0
Fork 0
mirror of https://hk.gh-proxy.com/https://github.com/NodeBB/nodebb-chinese-simplified.git synced 2025-10-03 07:51:23 +08:00
Code Issues Projects Packages Wiki Activity Actions

Update templates.rst

Browse source
This commit is contained in:
Qing Lei 2014-11-25 19:34:40 +08:00
parent 03dcee102f
commit 73b8e9d0e3
1 changed files with 17 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

34
themes/templates.rst
View file

@ -12,7 +12,7 @@ Just prepend api/ to the URL's path name to discover the JSON return. Any value


*A page's name corresponds to the template and language's filename (ex. ``http://domain.com/topic/xyz`` correlates to ``topic.tpl``). Sometimes this is not the case - ex. ``/user/xyz`` loads ``account.tpl``. Have a look at the ``custom_mapping`` section in ``public/templates/config.json`` for more details. *A page's name corresponds to the template and language's filename (ex. ``http://domain.com/topic/xyz`` correlates to ``topic.tpl``). Sometimes this is not the case - ex. ``/user/xyz`` loads ``account.tpl``. Have a look at the ``custom_mapping`` section in ``public/templates/config.json`` for more details.


Templating Basics 模板基础
------------------------------------------------------ ------------------------------------------------------


Using the API return as your guide, you can utilize any of those values in your template/logic. Using the above API call as an example, for anything in the root level of the return you can do something like: Using the API return as your guide, you can utilize any of those values in your template/logic. Using the above API call as an example, for anything in the root level of the return you can do something like:
@ -38,35 +38,35 @@ And finally you can loop through arrays and create blocks like so:


The above will create X copies of the above block, for each item in the posts array. The above will create X copies of the above block, for each item in the posts array.


Templating Logic 模板逻辑
------------------------------------------------------ ------------------------------------------------------


NodeBB's templating system implements some basic logic. Using the same API call as above for our example. You can write IF conditionals like so: NodeBB 的模板系统实现了一些基础的逻辑。Using the same API call as above for our example. 可以像下面这样写条件判断(IF):


.. code:: html .. code:: html


<!-- IF unreplied --> <!-- IF unreplied -->
This thread is unreplied! 此帖不可回复！
<!-- ENDIF unreplied --> <!-- ENDIF unreplied -->




Another example: 另一个例子:


.. code:: html .. code:: html


<!-- IF !disableSocialButtons --> <!-- IF !disableSocialButtons -->
<button>Share on Facebook</button> <button>分享到 Facebook</button>
<!-- ELSE --> <!-- ELSE -->
Sharing has been disabled. 分享已被禁用。
<!-- ENDIF !disableSocialButtons --> <!-- ENDIF !disableSocialButtons -->




We can check for the length of an array like so: 可以检查数组的长度，如下:


.. code:: html .. code:: html


<!-- IF posts.length --> <!-- IF posts.length -->
There be some posts 此处有回帖
<!-- ENDIF posts.length --> <!-- ENDIF posts.length -->




@ -88,12 +88,12 @@ While looping through an array, we can check if our current index is the @first
For more advanced documentation, have a look at the `templates.js <https://github.com/psychobunny/templates.js>`_ repository For more advanced documentation, have a look at the `templates.js <https://github.com/psychobunny/templates.js>`_ repository




Exposing template variables to client-side JavaScript 传递模板参数给客户端 JavaScript
------------------------------------------------------ ------------------------------------------------------


There are two ways of letting our JS know about data from the server-side, apart from WebSockets (TODO: will be covered in a different article). 有两种方式，让 JS 接收到客户端的数据, 除了 WebSockets 之外 (TODO: 将会在其他文章中叙述)。


Via jQuery.get 通过 jQuery.get
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^


If we require data from a different page we can make a ``$.get`` call to any other API call. For example, if we wanted to know more about a specific user we could make a call like so: If we require data from a different page we can make a ``$.get`` call to any other API call. For example, if we wanted to know more about a specific user we could make a call like so:
@ -107,7 +107,7 @@ If we require data from a different page we can make a ``$.get`` call to any oth


See this API call in action: http://community.nodebb.org/api/user/psychobunny See this API call in action: http://community.nodebb.org/api/user/psychobunny


Via Template Variables 通过模板变量
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^


In topic.tpl for example, we can add a hidden input like so: In topic.tpl for example, we can add a hidden input like so:
@ -124,7 +124,7 @@ The template system will immediately parse all of these and expose them via the


This is the ideal method of letting JS know about important variables within the template. This is the ideal method of letting JS know about important variables within the template.


Internationalization 国际化
--------------------- ---------------------


The template engine interfaces with the internationalization system as well. We can embed variables into language strings. Let's use `this API call <http://community.nodebb.org/api/register>`_ as well as this `language file <http://community.nodebb.org/language/en_GB/register.json>`_ as an example. We can now do something like the following: The template engine interfaces with the internationalization system as well. We can embed variables into language strings. Let's use `this API call <http://community.nodebb.org/api/register>`_ as well as this `language file <http://community.nodebb.org/language/en_GB/register.json>`_ as an example. We can now do something like the following:
@ -145,7 +145,7 @@ to


A unique username between 2 and 16 characters A unique username between 2 and 16 characters


Advanced Topics 高级话题
--------------------- ---------------------


Dynamically requiring and rendering a template file from client-side JavaScript Dynamically requiring and rendering a template file from client-side JavaScript
@ -178,7 +178,7 @@ You can also access the invidual blocks inside each template, which is handy for
}); });




Rendering templates on server-side Node.js 在服务端 Node.js 中渲染模板
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^


The templating system hooks into Express just like most other templating frameworks. Just use either ``app.render`` or ``res.render`` to parse the appropriate template. The templating system hooks into Express just like most other templating frameworks. Just use either ``app.render`` or ``res.render`` to parse the appropriate template.
@ -191,4 +191,4 @@ The templating system hooks into Express just like most other templating framewo


app.render('myTemplate', myData, function(err, parsedTemplate) { app.render('myTemplate', myData, function(err, parsedTemplate) {
console.log(parsedTemplate); console.log(parsedTemplate);
}); });