Hogan Js 和 AngularJs 与 Node Js
Posted
技术标签:
【中文标题】Hogan Js 和 AngularJs 与 Node Js【英文标题】：HoganJs and AngularJs with NodeJs 【发布时间】：2014-01-21 14:22:09 【问题描述】：我们正在尝试将 NodeJs 与 HoganJs 一起用于服务器端模板。然而，我们也希望使用 AngularJs 来满足我们的客户端需求。
问题在于 HoganJs 和 AngularJs 都使用“”和“”来完全满足他们的编译器需求。由于霍根的工作方式，如果有角的“”，霍根就会去掉。
我的问题是，是否有一个开箱即用的解决方案允许我同时使用 Angular 和 Hogan，而不会相互冲突。
如果没有，有没有人知道什么/在哪里/如何调整其中之一以使他们彼此相爱并优雅地工作。
提前谢谢...
【问题讨论】：
【参考方案1】：在不更改分隔符的情况下，在 Angular 1.x 上，您可以在使用 HoganJS、Mustache 或任何其他此类代码的元素中使用 ng-non-bindable 指令：
例子：
<div>
angularjs_variable
<div ng-non-bindable>hogan_variable</div>
</div>
如果元素包含看似 AngularJS 指令和绑定但应该被 AngularJS 忽略的内容，这很有用。 [...]
【讨论】：
【参考方案2】：如果您使用的是 express，您可以像这样更改 hogan 的分隔符：
var app = express();
app.locals.delimiters = '<% %>';
把上面的放在前面：
app.set('view engine', 'hjs');
现在在您的 page.hjs 文件中，对于数据 template : "Template test" ，您可以这样做：
<p>This is a <% template %></p>
【讨论】：
【参考方案3】：试试
Hogan.compile(text, delimiters: '<% %>');
这样您就可以更改分隔符 Hogan 通过向 compile 方法传递一个覆盖它们的选项来使用。
http://comments.gmane.org/gmane.comp.lang.javascript.express/1426
注意
imo 使用模板系统使用 angularjs 是没用的，因为 https://***.com/a/20270422/356380
【讨论】：
感谢您的回答...但是我应该在哪里嵌入此代码？我是否必须导入任何东西才能使用上面的 Hogan 变量？当我运行我的应用程序时，我得到一个无效的变量“Hogan”和“text”？有什么想法吗？ @Whisher 因为有服务器创建的数据和逻辑，我（我会假设其他人）希望将其构建到 html 之前它被提供给客户端 = 为什么我同时使用 dot 和 Angular。但是，是的，大部分繁重的工作都是在 Angular 中完成的。 @MikeSmithDev 这样说我可以理解你的观点，顺便说一句，我发现 mean.io 我认为部署的一个很好的策略点，即使我倾向于 handlebarsjs.complain html，他们也使用模板（翡翠） @Whisher 我用了 Jade 大约 2 天然后跑掉了 ;) @MikeSmithDev 是的...我从不理解人们使用翡翠的冲动...我猜...对于少数人来说，基准比常识更重要...【参考方案4】：如其他答案所示，可以替代更改 Hogan 分隔符...更改 Angular 的！我在使用 doT（也使用 和 ）时这样做了，它工作正常：
假设你的布局 HTML 中有这个：
<html ng-app="cooApp">
添加此脚本以使用自定义分隔符调用 Angular（我还包括对 Angular 的引用，只是为了澄清）：
<script src='//ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.min.js'></script>
<script>
var cooApp = angular.module('cooApp', [], function($interpolateProvider)
$interpolateProvider.startSymbol('%');
$interpolateProvider.endSymbol('%');
);
</script>
现在只需将% 和% 用于Angular 的东西。
【讨论】：
以上是关于Hogan Js 和 AngularJs 与 Node Js的主要内容，如果未能解决你的问题，请参考以下文章
客客NO.22活动预告 | AngularJS 控制器与视图 / model 数据绑定与事件绑定