如何使用Grails资产插件引用静态HTML rsource？

Question

我使用的是Grails 2.4.1和Grails资产管道插件版本1.9.7。

我有一个javascript文件（它定义了一个AngularJS指令），它需要引用一个静态超文本标记语言文件（它将用作AngularJS指令的模板）。

我如何在资产目录中引用HTML文件？

项目结构：

• 圣杯应用
• 资产
  • 脚本
    • 指令
      • 层次结构查看器.js
      • 层次结构查看器.html

      使用角度模板资产管道圣杯插件时的项目结构

      < li>grails应用程序 < ul > < li >资产 < ul > < li > javascripts < ul > < li >指令 < ul > < li>hierarchyviewer.js
      • hierarchyviewer.tpl.html

      directivea.js包含:

      angular.module('HierarchyViewer', []).directive('hierarchyviewer',function(){
          return {
              restrict: 'EA',
              scope: {},
              replace: true,
              controller: function ($scope, $http) {
              },
              templateUrl: 'hierarchyviewer.tpl.html'
          }
      
      })
      

      但是;当我尝试加载引用该指令的页面时，我得到一个404作为 directives/directivea.html 引用。

      使用资源管道插件时如何正确引用模板？

Answer 1

有一个插件叫角度-模板-资产-管道。它的本质是将你的. tpl.htm模板放到< code>$templateCache中。那么你可以像这样使用它(来自文档的例子):

angular.module('myApp.appSection', ['ngRoute'])
.config(function($routeProvider) {
      $routeProvider
          .when('/index', {
              templateUrl: 'index.htm'
          })
          .otherwise({redirectTo: '/index'});
});

Answer 2

角模板资产管道插件作者在这里。几个调整，这应该适合你。

• 该插件期望模块名称采用驼峰大小写。
• 该插件还会从文件名中删除 .tpl，因此在这种情况下，您最终会得到一个名为 hierarchyviewertemplate 的文件.js
• 确保文件名（不包括扩展名）是唯一的。

在最后一点上，由于资产管道插件将忽略资产目录中的父文件夹，以下每个位置中的文件都将导致冲突:

• /assets/javascripts/hierarchyviewertemplate。js
• /assets/templates/hierarchyviewertemplate.tpl。html

就实际代码而言，这样的东西应该更适合您：

//= require_self
//= require_tree /hierarchyViewer

angular.module('hierarchyViewer', []).directive('hierarchyviewer',function(){
    return {
        restrict: 'EA',
        scope: {},
        replace: true,
        controller: function ($scope, $http) {
        },
        templateUrl: 'hierarchyviewertemplate.html'
    }
});

这将假设您的hierarchyviewertemplate.tpl。html文件位于

grails-app -

如果您的模板包含在插件中，请用< code>require_full_tree替换< code>require_tree

希望有帮助。