※ 引述《mrbigmouth (大嘴先生)》之铭言:
: 但html是一个很好的"资料表达"语言,而不是一个好的"程式"语言
这句话说的好,不过 XML 本来就是种资料表示法吧?
我觉得 Angular 的 Directive 从根本上来说就不是 Template engine。
Server 端的许多 Template engine,核心都是 Text processing + Binding。
而 Angular 只有 Binding,没有 Text processing。
Directive 的功用为扩充 HTML,为其增加新的行为。
: <header ng-repeat-start="item in items">
: Header {{ item }}
: </header>
: <div class="body">
: Body {{ item }}
: </div>
: <footer ng-repeat-end>
: Footer {{ item }}
: </footer>
这个是在 Angular 中违和感最重的一个 directive 了。跟其它的
directive 格格不入,我也觉得很微妙。
一般 ng-repeat 的行为︰重复自身,并把资料丢进 child scope 内。
<section ng-repeat="item in items">
...
</section>
这样写不是很好吗
: <%
: for (item in items) {
: %>
: <header>
: Header <%- item %>
: </header>
: <div class="body">
: Body <%- item %>
: </div>
: <footer>
: Footer <%- item %>
: </footer>
: <%
: }
: %>
这个就回归一般的 text processing。事实上用它来 render 非 HTML 的东西
也没什么不可。
: <div ng-show="someBooleanVariable"></div>
ng-show 的行为︰当资料为 no、false 时,隐藏自己
: <%
: if (someBooleanVariable) {
: %>
: <div></div>
: <%
: }
: %>
这也回归一般的 text preprocessing。
Directive 和这些 template engine 的不同,就在于 directive 是用来改变
已经 render 出来,HTML element 的行为。而 template engine 是根据定好
的流程,把 HTML render 出来。
以我来说,Directive 的做法是比较适合前端的,而一般的 template engine
适合后端。
要是想做 text processing,也可以把 template engine 写成 directive
<div template-engine template-engine-data="myTemplate">
<% if (var) { %>
<span>Hi</span>
<% } %>
</div>
template-engine 行为︰将自身内容和 templateEngineData 丢给
text processor,再将结果替换为自身内容。还可以 watch
templateEngineData,当资料改变时 re-render……等等。
说不定已经有人实作过了。