摘要:在文件中使用模板模板定義三個最高級別的標(biāo)簽不用寫了,能省則省的模板可以自由的使用標(biāo)簽比如上面的使用的標(biāo)簽。在模板中使用邏輯是模板語言,是安全的不會輸出標(biāo)簽他具有以下常用的語法導(dǎo)入指定的模板循環(huán)判斷等詳細(xì)的說明可以參考。
新建一個項目Meteor
meteor create meteor-template
會生成三個文件:
meteor-template.css meteor-template.html meteor-template.js
這三個文件就是模板文件,.js文件是邏輯和數(shù)據(jù)控制文件,.css文件是樣式文件。
訪問.html文件會自動加載.js和.css文件。
Meteor模板定義三個最高級別的標(biāo)簽
meteor-study I am Meteor!
{{> meteor_study}}{{templateName}}
{{#each languages}}{{name}}
{{/each}}
不用寫了,能省則省!
Meteor的模板可以自由的使用html標(biāo)簽比如上面的使用的標(biāo)簽。
{{}}是模板語言,是安全的不會輸出html標(biāo)簽
他具有以下常用的語法:
{{> meteor_study}}導(dǎo)入指定的模板
{{#each langages}} {{/each}}循環(huán)
{{#if done}}done{{else}}notdone{{/if}} if判斷
等...
詳細(xì)的說明可以參考。
在MVC的模式中可以在Controller層給View層賦值,在Meteor中也可以在.js文件中給模板賦值:
if (Meteor.isClient) { Template.meteor_study.helpers({ templateName:"Meteor Study", languages:[{name:"Node"},{name:"Meteor"},{name:"html"},{name:"css"}] }); }
其中Meteor.isClient這句話判斷是不是在客戶端,在客戶端就使用Template.meteor_study.helpers 給模板變量賦值。使用templateName和languages分別定義了一個字符串和一個數(shù)組。
使用css.css文件負(fù)責(zé)控制樣式,在meteor-template.css添加代碼:
body { font-family: sans-serif; background-color: #315481; background-image: linear-gradient(to bottom, #315481, #918e82 100%); background-attachment: fixed; position: absolute; top: 10px; bottom: 0; left: 10px; right: 0; padding: 0; margin: 0; font-size: 14px; } header { background: #d2edf4; background-image: linear-gradient(to bottom, #d0edf5, #e1e5f0 100%); padding: 20px 15px 15px 15px; position: relative; } h1 { font-size: 1.5em; margin: 0; margin-bottom: 10px; display: inline-block; margin-right: 1em; }
最終顯示的效果:
代碼地址:https://github.com/jjz/meteor...
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/18779.html
摘要:當(dāng)一個應(yīng)用啟動時,會自動加載這些庫,為應(yīng)用提供了一個基礎(chǔ)環(huán)境。也就是說,模板文件只能包含以這三種標(biāo)簽為頂層標(biāo)簽的片段。在中,我們需要判斷當(dāng)前的具體運行環(huán)境,以便執(zhí)行相應(yīng)的代碼。 一、全棧開發(fā)平臺 - 不僅僅是前端 Meteor和那些名聲如雷貫耳的前端框架,比如Angular, React等都不一樣,它是一個 采用單一開發(fā)語言的全棧開發(fā)的平臺:開發(fā)者可以使用JavaScript同時 進...
摘要:在我的機子上,運行于端口,以避免和其他默認(rèn)運行于端口的沖突。我們可以使用命令連接數(shù)據(jù)庫查看定義應(yīng)用層次創(chuàng)建的模板應(yīng)用有一個問題,客戶端和服務(wù)器段的代碼是一樣的。在中加入然后添加問題模板注意我們使用了來確保用戶未登錄的情況下應(yīng)用。 編者注:我們發(fā)現(xiàn)了有趣的一系列文章《30天學(xué)習(xí)30種新技術(shù)》,正在翻譯中,一天一篇更新,年終禮包。下面是第15天的內(nèi)容。 到目前為止我們討論了Bower...
摘要:在我的機子上,運行于端口,以避免和其他默認(rèn)運行于端口的沖突。我們可以使用命令連接數(shù)據(jù)庫查看定義應(yīng)用層次創(chuàng)建的模板應(yīng)用有一個問題,客戶端和服務(wù)器段的代碼是一樣的。在中加入然后添加問題模板注意我們使用了來確保用戶未登錄的情況下應(yīng)用。 編者注:我們發(fā)現(xiàn)了有趣的一系列文章《30天學(xué)習(xí)30種新技術(shù)》,正在翻譯中,一天一篇更新,年終禮包。下面是第15天的內(nèi)容。 到目前為止我們討論了Bower...
摘要:與此同時,服務(wù)器在后臺更新。這種調(diào)整稱為延遲補償,向用戶提供了更高的認(rèn)知速度。網(wǎng)站地址安裝運行命令新建項目使用可以創(chuàng)建一個新項目運行運行可以直接運行項目在瀏覽器中輸入就可以看到一個網(wǎng)頁 Meteor是什么 Meteor是一種最新的JavaScript框架,用于自動化和簡化實時運行的Web應(yīng)用程序的開發(fā),它使用分布式數(shù)據(jù)協(xié)議-(Distributed Data Protocol,DDP)...
摘要:中的在中時時刻刻都不能離開,表單提交來看看在里面如何提交表單吧首先是這里我們定義了一個表單,為,有一個的還有一個提交的按鈕。 Meteor中的form 在web中時時刻刻都不能離開form,表單提交,來看看在meteor里面如何提交表單吧!首先是 HTML: meteor-form form Welcome t...
閱讀 3063·2023-04-26 00:40
閱讀 2408·2021-09-27 13:47
閱讀 4267·2021-09-07 10:22
閱讀 2974·2021-09-06 15:02
閱讀 3322·2021-09-04 16:45
閱讀 2507·2021-08-11 10:23
閱讀 3612·2021-07-26 23:38
閱讀 2908·2019-08-30 15:54