如何在Rails应用程序中将AngularJS路由与Haml模板一起使用

萨拉·弗塞尔斯

我有要用作AngularJS模板的app / assets / templates / api-list.haml。我按照本教程创建了一个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。

我也尝试$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: Unknown provider: $templateCache from ApiApp

如何说服我的路线使用模板$templateCache而不是尝试通过新请求加载模板

萨拉·弗塞尔斯

我有没有工作的东西$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.hamlapi-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帮助器获取路径。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在Marionette JS中将路由器与应用程序一起使用

来自分类Dev

如何在Trigger.io应用程序中将Angular视图模板与本地模板文件一起使用?

来自分类Dev

如何在Rails 4.1应用程序中将基于事件的文件系统侦听器与Spring一起使用

来自分类Dev

如何在.NET Web API应用程序中将FluentValidation与Swagger一起使用?

来自分类Dev

如何在电子应用程序中将sqlite3与变量一起使用

来自分类Dev

如何在桌面应用程序中将DbContext与DI一起使用?

来自分类Dev

在Rails应用程序中将实例方法与Chartkick一起使用

来自分类Dev

在Rails应用程序中将CarrierWave与Amazon Elastic Transcoder一起使用

来自分类Dev

在Rails应用程序中将实例方法与Chartkick一起使用

来自分类Dev

如何在Nginx中将WordPress与Django应用程序一起安装

来自分类Dev

Phonegap和AngularJS如何在应用程序中一起工作?

来自分类Dev

Phonegap和AngularJS如何在应用程序中一起工作?

来自分类Dev

如何在Rails中将jQuery与Sunspot一起使用?

来自分类Dev

蓝牙信标如何与应用程序一起使用?

来自分类Dev

如何在同一个Angular JS应用程序中将不同的API与不同的身份验证标头一起使用

来自分类Dev

Shopify应用程序-将脚本标签与Ruby on Rails应用程序一起使用

来自分类Dev

Shopify应用程序-将脚本标签与Ruby on Rails应用程序一起使用

来自分类Dev

如何在ASP.NET中将应用程序数据与用户信息结合在一起

来自分类Dev

如何在wpf / winforms应用程序(带有图片)中将DLL与.exe组合在一起

来自分类Dev

如何在Rails应用程序模板中使用postgres?

来自分类Dev

ES6模块在Node / Express路由应用程序中如何与app.get一起使用?

来自分类Dev

将应用程序路由器与Polymer一起使用

来自分类Dev

如何在Facebook开发人员应用程序中指定站点路径以在Rails中与www一起使用而没有www?

来自分类Dev

无法在Rust / Actix应用程序中将计时功能与柴油一起使用

来自分类Dev

在Windows应用程序中将Windows身份验证与Sql Server一起使用

来自分类Dev

在WinExist中将应用程序名称与空格一起使用

来自分类Dev

在角度应用程序中将Ui-select与多个类别一起使用

来自分类Dev

获取angularjs应用程序以与另一个应用程序(流星)一起使用

来自分类Dev

如何在Android Studio中复制应用程序以与其他资源一起使用?

Related 相关文章

  1. 1

    如何在Marionette JS中将路由器与应用程序一起使用

  2. 2

    如何在Trigger.io应用程序中将Angular视图模板与本地模板文件一起使用?

  3. 3

    如何在Rails 4.1应用程序中将基于事件的文件系统侦听器与Spring一起使用

  4. 4

    如何在.NET Web API应用程序中将FluentValidation与Swagger一起使用?

  5. 5

    如何在电子应用程序中将sqlite3与变量一起使用

  6. 6

    如何在桌面应用程序中将DbContext与DI一起使用?

  7. 7

    在Rails应用程序中将实例方法与Chartkick一起使用

  8. 8

    在Rails应用程序中将CarrierWave与Amazon Elastic Transcoder一起使用

  9. 9

    在Rails应用程序中将实例方法与Chartkick一起使用

  10. 10

    如何在Nginx中将WordPress与Django应用程序一起安装

  11. 11

    Phonegap和AngularJS如何在应用程序中一起工作?

  12. 12

    Phonegap和AngularJS如何在应用程序中一起工作?

  13. 13

    如何在Rails中将jQuery与Sunspot一起使用?

  14. 14

    蓝牙信标如何与应用程序一起使用?

  15. 15

    如何在同一个Angular JS应用程序中将不同的API与不同的身份验证标头一起使用

  16. 16

    Shopify应用程序-将脚本标签与Ruby on Rails应用程序一起使用

  17. 17

    Shopify应用程序-将脚本标签与Ruby on Rails应用程序一起使用

  18. 18

    如何在ASP.NET中将应用程序数据与用户信息结合在一起

  19. 19

    如何在wpf / winforms应用程序(带有图片)中将DLL与.exe组合在一起

  20. 20

    如何在Rails应用程序模板中使用postgres?

  21. 21

    ES6模块在Node / Express路由应用程序中如何与app.get一起使用?

  22. 22

    将应用程序路由器与Polymer一起使用

  23. 23

    如何在Facebook开发人员应用程序中指定站点路径以在Rails中与www一起使用而没有www?

  24. 24

    无法在Rust / Actix应用程序中将计时功能与柴油一起使用

  25. 25

    在Windows应用程序中将Windows身份验证与Sql Server一起使用

  26. 26

    在WinExist中将应用程序名称与空格一起使用

  27. 27

    在角度应用程序中将Ui-select与多个类别一起使用

  28. 28

    获取angularjs应用程序以与另一个应用程序(流星)一起使用

  29. 29

    如何在Android Studio中复制应用程序以与其他资源一起使用?

热门标签

归档