如何设置Grails和AngularJS局部模板 [英] How to setup Grails and AngularJS partial templates

问题描述

我使用的前端的 AngularJS 实现一个项目，和Grails的后端。

I am realizing a project using AngularJS for the front end, and Grails for the backend.

• 角JS =>单页的应用程序


• 的Grails => REST API将在WebApp本身和第三方应用程序使用。

• Angular JS => Single page application
• Grails => REST API to be used in the WebApp itself and 3rd party apps.

这是我如何设置项目：

web-app
   |
   |_____ js ( angular controllers, modules, partial templates.)
   |
   |_____ images
   |
   |_____ css


grails-app
   |
   |_____ views ( in here I have my main view, the one I use at the first user request )

而不是使用资源插件，我preFER建设有咕噜我自己的前端，然后我只有最后的文件链接的布局本身。

Rather than using the Resources Plugin, I prefer building my own front end with Grunt, and then I only link the final files inside the layout itself.

我构造的 JS 文件夹中的web应用程序包含一个谐音文件夹中的所有部分的模板进行所谓内AngularJS

I structured the js folder in web-app to contain a partials folder with all the partial templates to be called within AngularJS

这是我的pretty标准角code加载的意见：

This is my pretty standard angular code to load the views:

angular.module('myapp', []).
  config(['$routeProvider', function($routeProvider) {
  $routeProvider
    .when('/invoices', {
        templateUrl: 'partials/invoices-list.html',   
        controller: InvoiceListCtrl
    })
    .when('/invoices/:invoiceId', {
        templateUrl: 'partials/invoice-details.html', 
        controller: InvoiceDetailCtrl}
    )
    .otherwise({redirectTo: '/dashboard'}, {
        templateUrl: 'partials/dashboard.html', 
        controller: DashboardCtrl
    });
}]);

什么情况是，角是无法得到这些局部模板，因为部分文件夹没有在Tomcat 复制工作目录

我不知道哪个其他的方法可以用于一个Grails供电项目

I don't know which other approach can be used for a Grails powered project.

推荐答案

我相信这个问题是静态资源没有从默认的Grails应用目录下来，所以你需要包括从文档根目录，例如完整路径 templateUrl：/partials/invoices-list.html，

I believe the issue is that the static resource is not descended from the default grails-app directory so you need to include the full path from the document root, e.g. templateUrl: '/partials/invoices-list.html',

下面是我设置了UI路由器：

Here is my set up for ui-router:

App.config([
  '$stateProvider'
  '$urlRouterProvider'

  ($stateProvider, $urlRouterProvider) ->

    $urlRouterProvider.otherwise("/")

    $stateProvider
      .state('intro', {
        url: "/",
        templateUrl: '/templates/intro.html'
      })

这篇关于如何设置Grails和AngularJS局部模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！