javascript - 如何在 Rails 应用程序中使用带有 Haml 模板的 AngularJS 路由

Question

我有 app/assets/templates/api-list.haml，我想将其用作 AngularJS 模板。我关注了this tutorial创建一个 templates.js 文件，将我所有已编译的 Haml AngularJS 模板插入到 $templateCache 中。但是，我似乎无法让这些缓存的模板与我的 AngularJS 路由一起使用:

api_app.config(['$routeProvider', ($routeProvider) ->
  $routeProvider.when '/',
    templateUrl: 'api-list'
    controller: api_app.ApiListController
  $routeProvider.otherwise
    redirectTo: '/'
])

当我加载我的应用程序时，我在浏览器控制台中看到 404 错误，因为它试图向 http://localhost:3000/api-list 发出请求。我可以在浏览器中查看/assets/templates.js 并看到 $templateCache.put("api-list" 已定义，因此应该有一个名为“api-list”的模板。我在定义路由之前在我的页面中加载 templates.js。

我还尝试在我的路由配置中注入(inject) $templateCache，如下所示:

api_app.config(['$routeProvider', ($routeProvider, $templateCache) ->
  $routeProvider.when '/',
    template: $templateCache.get('api-list')
    controller: api_app.ApiListController
  $routeProvider.otherwise
    redirectTo: '/'
])

这会导致 Uncaught TypeError: Cannot call method 'get' of undefined from ApiApp 错误。如果我将第一行更改为 api_app.config(['$routeProvider', '$templateCache', ($routeProvider, $templateCache) ->，我反而会收到错误 Uncaught Error:未知提供者:来自 ApiApp 的 $templateCache。

我如何说服我的路由使用来自 $templateCache 的模板，而不是尝试通过新请求加载它？

Answer 1

我在没有 $templateCache 的情况下得到了一些东西.我用以下内容制作了一个 config/initializers/haml.rb 文件:

Rails.application.assets.register_engine '.haml', Tilt::HamlTemplate

然后在我的 config/application.rb 中，我添加了 config.assets.paths << Rails.root.join('app', 'assets', 'templates') .

我还从 api-list.haml 重命名了我的模板文件至 api-list.html.haml .我的路线现在看起来像这样:

api_app.config(['$routeProvider', ($routeProvider) ->
  $routeProvider.when '/',
    templateUrl: '/assets/api-list.html'
    controller: api_app.ApiListController
  $routeProvider.otherwise
    redirectTo: '/'
])

我不喜欢 /assets在那里进行了硬编码，所以我最终可能会将此文件从 routes.js.coffee 更改为 routes.js.erb 并使用 Rails 助手来获取路径。