Question

所以我正在构建一个应用程序，最初我向服务器介绍了使用JSON进行HTML模板化的handlebars.js，这很棒。

但我想我可能在概念上错过了一些东西，因为我理解Angular JS也有模板功能？这些技术应该不能一起使用吗？

无论如何，因为我首先使用handlebars.js，我的把手中有模板，模板中包含的是ng-click当然不会触发，因为Angular不知道它并且它不是在Angular编译。

有一种方法可以在我运行类似的东西时告诉Angular手柄模板中的ng-click：

var source   = $("#newPostTemplate").html();
var template = Handlebars.compile(source);
$("#subBoxone").append(template(theData));

或者我应该只做一个Angular模板？我对Angular中的模板知之甚少，所以继续使用我的handlebars.js实现并且让该模板中的ng-click工作会更好。我该怎么做？

这是包含ng-click的模板的一部分：

<button class="btn btn-primary btn-lg thoughtButton" ng-click="pollData()">Submit Additional Comment!</button>

我可以将ng-click附加到DOM层次结构中更高的另一个元素，并使用$event来确定它是否是我想的正确的，但我更愿意利用这个生成的{{1直接。

谢谢，如果有必要，我很乐意提供更多信息！

Answer 1

您可以为模板部分保留Handlebars，但是您需要添加一个指令，负责执行Handlebars模板化，然后进行编译。

要编译HTML块，您可以拥有一个带有template / compile函数的指令，或者自己手动编译link函数$compile。我之前从未使用过Handlebars所以你可能需要进行一些实验，但是一个例子就是：

angular.module('handlebarsTemplate', [])
  .directive('handlebarsTemplate', function() {
    return {
      ...
      template: function(tElem, tAttrs) {
        var html = tElem.html();
        var template = Handlebars.compile(html);
        return template;
      }
      ...
    };
  });

因此，无论您拥有Handlebars模板，只需将其包装在此指令中，它就应该使用Angular与编译好的Handlebars模板进行编译。

在Handlebars.JS模板中的Ng-Click将无法触发

1 个答案: