Comments (13)
另外,个人建议默认输出是HTML转义的,在必要时刻才使用$value|raw
来取消HTML转义,以减少XSS出现的可能性
from er.
我个人感觉for, if这些功能还是放到业务逻辑里面去做比较靠谱,模板就应该简单一些,不要加入太多的语言特性。
另外,个人建议默认输出是HTML转义的,在必要时刻才使用$value|raw来取消HTML转义,以减少XSS出现的可能性
这个我是支持的。
from er.
模板要是 Mustache 风格的就好了,现在完全爱上这种写法了,极度简单明了!如果需要母版之类的支持,扩展几种符号也能完全搞定。
from er.
@mytharcher 我有考虑过写个Mustache的helper接esui,然后让er+esui可以用mustache,不过这最多会做为一个patch出来,ER本身依旧会用这一套模板,这是考虑业务线的工程师的熟悉性和掌握在 @errorrik 手里需求的可控性。
另外,Mustache有一个很有趣的问题,比如我知道我有10页的内容,现在要生成一个Pager。在不使用helper的情况下,Mustache因为没有for
功能,所以搞不了这事,我的方法是在data中弄个数组[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
,然后用这个数组去生成Pager……
我提这个只是想说明,就算我们用Mustache,为了支持产品线的很多常见需求,也得再弄个helper bundle出来。
我还想推荐jade呢,不过esui本身的出发点就是无js情况下HTML基本可用,所以还是算了
from er.
Pager不就应该是组件考虑的事么。。。好像从来没在模板里写Pager。对于这类特殊需求,用管道过滤器的模式应该可以解决大部分,只不过可能有的方法会略恶心,比如数组索引从0开始,我要生成个1开始的序号。
当然我只是个建议,目前看来要迁移一种模板风格成本可能略大。
from er.
我个人感觉for, if这些功能还是放到业务逻辑里面去做比较靠谱,模板就应该简单一些,不要加入太多的语言特性。
有不少人和我提过类似的想法,我说说我的出发点。
举一个简单的例子:
有一篇文章,要说明contributor,有一个数组的人名,要显示出来。
这是个很简单的需求,我们一开始决定用逗号分隔显示人名,在模板不支持for
的情况下,我会这么做:
data.contributors = data.contributors.join(', ');
render(data);
既然模板没有for
么,这事只能在Action层处理,那就这样,挺直观的。
然后,这个需求说变就变了(该死的PM),现在我们人名要显示为一个列表了,所以我得这样写代码:
var template = require('er/template');
// 模板内容就是`<li>${name}</li>`
var singleContributorTemplate = template.get('singleContributor');
var html = [];
for (var i = 0; i < data.contributors.length; i++) {
// 很遗憾我们的template还没有format这种功能,得用其它库
var item = require('tangram').format(template, data.contributors[i]);
html.push(item);
}
render('<ul>' + html.join('\n') + '</ul>');
可以看到:
- 当展现方式变化时,我要改tpl和js逻辑
- js逻辑太多地关注 用什么标签 , 生成什么结构 这样的事,再加上事件监听、逻辑处理等工作,js复杂而臃肿
因此,我支持模板实现for
等功能,不过for
里要不要带index
可以讨论。
from er.
认同你的观点,无论用Mustache还是jade还是ejs还是啥,我们总是有办法实现相同的功能,ER带的template说实话语法不怎么爽,希望不要被 @errorrik 打~不过反驳一个观点:
Pager不就应该是组件考虑的事么
ER和组件没有关系,使用ER做项目并没有 有Pager这么个组件 这样的前提,看 example/book-store 这个示例,ER支持很单纯的HTML+CSS+JS,在图书列表页我也演示了pager咋生成。
from er.
for 的index功能现在就是支持的。变量的支持我持保留态度。
默认html转义的功能fixed on 49ddbfb
这套模板设计时候最大的初衷就是写的时候能有语法高亮,所以就设计成特殊html注释来做了。从语法本身来说,就是一个很普通的模板语法,和爽实在差的太远,也没往那靠过。
确实,在能满足需求的前提下,Mustache是很爽的。
from er.
随便唠叨一下,和现在的ER无关。
其实我曾经一直在想,ER确实是需要提供一个默认的模板,但是不是要把模板变成可配置的,比如
// 事实上是需要adapter的
require('er/config').template = 'Mustache';
View中这么实现:
var config = require('./config');
require(
[config.template || './template'],
this.renderTemplate.bind(this)
);
不过考虑到这么一搞,不能用不带callback
的require
,整个流程挺难受。另一方面来说,现在的View
都这么轻量了,几乎啥也没有,不想要ER的自带template的话可以自己去建个MustacheView
基类,甚至不用继承ER的View
,Action只要有render
方法就当View用,根本不关心类型。
所以,这事也就没做了,在这里就是把当时的思考过程记录下,社区里或者内部哪个项目团队在这方面有想法不打算用这个弱暴了(真心的,别打我)的template实现的话,可以把这段话丢给他。
from er.
真要支持多种模板引擎的话,不如学学TJ大神在Express里engine的做法,专门搞了consolidation这个中间件来adapt。这样ER就不用关注模板怎么实现了,而原来的就当一套默认引擎附带就OK了。
只是没仔细看node下的consolidation是不是可以省点事改改那到前端来用。
from er.
@mytharcher Express的做法我参考过,唯一的问题是,node是CommonJS,而浏览器端是AMD,AMD只有静态的require(id)
才可以分析并优化,如果id是个动态的变量之类的,又会额外加入一次异步,出问题丢掉CallStack等,感觉得不偿失,所以没干。
from er.
这套模板最开始的设计,是希望能够有一个写html的地方。当时的考虑是,逻辑相关的东西,我们有javascript,为什么要在模板里做。当然,设计得这么简单得原因,也是因为有性能的考虑。
所以,现在看来,这个模板要是和开源社区的模板比起来,确实是功能弱。我觉得,有空的时候可以搞一把,不过不是现在。其实现在也能满足90%以上的需求。
我一向对添加feature持谨慎态度。当时添加for和if已经让性能降低了一倍多,所以,一直也没往里面加功能。如果再+,就要考虑预编译成function了,以及缓存模板merge结果等优化了。
from er.
暂时关掉本Issue,待template模块测试用例齐全了再开话题讨论功能上的增强~
from er.
Related Issues (20)
- 子Action中a标签外跳到一个er path的需求 HOT 7
- [template]etpl2/3从Model中取值问题 HOT 2
- deferred中加入一个方法控制串行请求合适么? HOT 9
- controller#forward,mix options给actionContext会出问题 HOT 2
- 两层以上的ChildAction里发生global redirect的时候会报错 HOT 6
- 页面切换次数多了的时候,会出现hash跳转了但是view没渲染的情况 HOT 24
- 开放路径访问权限方法 HOT 1
- enteractionfail事件增加参数
- ER 不在npmjs.org 里? HOT 4
- ER的两点疑问 HOT 11
- er/controller forwardaction 并不能阻止后续load行为 HOT 1
- 老ER里refresh 为啥只刷新控件,而不重载render整个 tpl HOT 1
- locator中updateURL函数为啥还要比较一次getLocation() !== url HOT 1
- er在ie6,7,8里哪些功能不能用? HOT 2
- 有什么地方可以设置所有的action在complete的时候执行同一个方法么? HOT 2
- [email protected] 与 [email protected] 兼容问题 HOT 3
- Model 中复制 datasource 有 bug
- er的默认路径可以默认不显示吗?
- events.js中有几个event的说明重复有误
- 貌似这里promise resolver里this指向全局,并没有绑定当前context是promise
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from er.