如何將模板從html文件加載到Angular應用中？

Question

我的Angular應用程序中有一堆模板html文件，並且分發效率越來越低。 因此，我檢查了grunt-angular-combine ，將所有模板都放入一個HTML文件中。 所以現在看起來

<script type="text/ng-template" id="modules/home/profile.template.html">
<div id="template-seasons">
    This is empty! But it's the proifle template
</div></script>
<script type="text/ng-template" id="modules/home/score.template.html">
...

問題是，如何將所有這些單獨的模板“導入”到我的應用程序中，以便可以從ui-router狀態， ng-includes等引用它們。

Answer 1

加載結果文件，然后您可以在ui-router配置中的templateUrl中使用它的路徑。

templateUrl: "modules/home/profile.template.html"

或者，如果需要在某個地方使用$ compile，請使用$templateCache.get("modules/home/profile.template.html")來獲取模板。