CODEWITHSUNDEEP
angularjstemplatesruby-on-rails-4
sameera207
sameera207

Reputation: 16619

Loading HTML templates with Angularjs and Rails

I cannot get my template load in my Rails app with Angularjs. Following is my setup

#app/assets/javascripts/app.js
app = angular.module('app', ['ui.router', 'templates'])
app.config(function($stateProvider, $urlRouterProvider) {
  $urlRouterProvider.otherwise("/home");
  $stateProvider
    .state('home', {
      url: '/home',
      templateUrl: 'home.html'
    })
});

#app/assets/javascripts/templates/home.html
<h1>abc</h1>

#app/assets/javascripts/application.js
//= require jquery
//= require jquery_ujs
//= require angular/angular
//= require angular-ui-router/release/angular-ui-router
//= require angular-rails-templates
//= require_tree ./templates
//= require_tree .

#app/views/layouts/application.html.erb
<body ng-app="app">
<div ui-view=''></div>

and I'm getting the following error

http://localhost:3000/home.html 404 (Not Found)

But if I use template instead of templateUrl, and give inline HTML it works fine.

I'm using angular-rails-templates-0.1.3 and rails-4.2.0

Upvotes: 2

Views: 1107

Answers (2)

DRobinson
DRobinson

Reputation: 4471

It looks like the version of angular-rails-templates had a bug, which was fixed in 0.1.4 (https://github.com/pitr/angular-rails-templates/issues/95). So updating your gem to a newer version should fix the bug.

Try updating your version of angular-rails-templates

I would not suggest manually placing '/javascripts/templates/home.html' (or the correct form: '/assets/javascripts/templates/home.html'), since this is part of the assets pipeline.

EDIT: If Sprockets 3+ is required -- e.g. for ES6 Javascript syntax -- you will have to look into a different fix. A couple potential fixes are suggested in this thread: https://github.com/pitr/angular-rails-templates/issues/93 . However, the maintainers of the angular-rails-templates project seems to be having some trouble solving this issue.

Though mcasimir's suggestion of replacing angular-rails-templates with a simple Ruby initializer and a few lines of JS code might do the trick, if upgrading angular-rails-templates (/downgrading sprockets) is not an option https://github.com/pitr/angular-rails-templates/issues/93#issuecomment-109953596

Upvotes: 1

radius
radius

Reputation: 159

Try changing:

templateUrl: 'home.html'

to: 

templateUrl: '/javascripts/templates/home.html'

Upvotes: 0

Related Questions