在一个外部 .html 上包含角度模板 [英] Including angular templates on one external .html

问题描述

在 angular 中，您可以在页面本身中创建一个模板，例如:

In angular, you can create a template in the page itself like:

<script type="text/ng-template" id="something.htm">
    <div>This is a template.</div>
</script>

我想知道您是否可以将其中的一堆并将它们放在一个外部页面中，例如templates.htm"，然后引用整个页面，本质上是说在 templates.htm 中查找模板中的某些内容".htm."

I'm wondering if you can take a bunch of these and put them together in an external page, like "templates.htm", and then reference the entire page, essentially saying "look in templates.htm for the template something.htm."

推荐答案

如果你不介意稍微降低性能，这里是我在评论中所说的一个工作示例.

If you don't mind a little decrease in performance, here is a working example for what I have said in the comment.

示例: http://plnkr.co/edit/EcEySnmmm3hsLimDHfYr?p=预览

关键概念是删除 np-app 并在 templates.html 加载后手动引导应用程序.

The key concept is to remove the np-app and bootstrap the app manually after the templates.html is loaded.

$.get('templates.html').done(function (rawHtml) {
  angular.module('app').run(function ($compile) {
    $compile(rawHtml)({});
  });

  angular.element(document).ready(function () {
    angular.bootstrap(document, ['app']);
  });
});

这篇关于在一个外部 .html 上包含角度模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！