0

所以我试图让一个简单的 Grails 3 和 Angular 应用程序正常工作。在本地启动后，我希望我的app.js文件被加载，然后加载我的index.html.

我不完全确定它是如何index/main gsps工作的，但我的理解是，使用asset-pipeline，它应该直接指向我的app.js下面src/main/webapp/js并$routeProvider处理其余的。但它永远不会重定向到我的app.js. 它似乎仍在搜索文件夹中的grails-app/assets文件。

这是我的index.gsp：

<!doctype html>
<html>
<head>

<asset:javascript src="app.js"/>
</head>
<body>

<asset:javascript src="app.js"/>
</body>
</html>

main.gsp：

<!doctype html>
<html lang="en" class="no-js">
<head>

<p>Here</p>

<asset:javascript src="../../../src/main/webapp/js/app.js"/>

<g:layoutHead/>
</head>
<body>

<g:layoutBody/>

<asset:javascript src="../../../src/main/webapp/js/app.js"/>

这是我context-path的application.yml

server:
   contextPath: '/item-upload'

我app.js的位于src/main/webapp/js. 这是 Grails 3 中的替换目录webapp。所以我将我的 js、html 和 css 文件放在那里。

App.js：

(function (angular) {
'use strict';

angular.module('common.initSideNavPanel', []);

var ngModule = angular.module('app', [
    'ngRoute',
    'ngAnimate',
    'item-upload'
]);

// Configure routing
ngModule.config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/', {templateUrl: 'html/index.html', controller: 'UploadCtrl', pageName: 'upload'});

}]);

}(window.angular));

任何想法我做错了什么？

4

1 回答 1

1

目录结构很重要。

资产管道插件要求资源位于某些目录中，除非您控制在build.gradle文件中指定资产管道配置。

从资产管道的文档来看，这应该是文件夹结构。

Within the grails-app/assets directory are several subfolders
    grails-app/assets/javascripts
    grails-app/assets/stylesheets
    grails-app/assets/images
否则，控制

您可以通过（请参阅此处）包含其他文件夹

// in build.gradle
assets {
  includes = ['your/more/js/or/images/folders/etc', 'another/one']
  excludes = ['**/*.less']
}

完成此操作后，要在 gsp 文件中引用您的资源，您需要使用

<asset:javascript src="app.js"/>

您如何在<asset>标签中引用资源的路径。

假设您grails-app/assets/javascripts/angularjs/app.js在资产文件夹中有这样的文件，然后引用它，您应该这样做

<asset:javascript src="angularjs/app.js"/> // NOTE: assets/javascripts is omitted from the path.

希望这可以帮助。

作为旁注，请远离src/main/webapp文件夹。Grails 3 推荐使用src/main/resources/public（用于公共资源。静态文件，如 html 等）和src/main/resource.

于 2017-04-19T18:31:29.927 回答