angular routing and templating issue

Question

i am learning how to use angularjs routing and templating, and i have come across a problem. I have added the gem in Gemfile, added //= require angular-rails-templates in application.js, and added the dependancy in my main angular.module

angular.module('authentication', ['authenticationModule','ngRoute','templates'])
.config(['$routeProvider',function($provider){
$provider
.when('/sign_in', { templateUrl: '/assets/signin.html', controller: 'redirectCtrl'})
.when('/sign_up', { templateUrl: 'templates/signup.html.erb', controller: 'redirectCtrl1'})
.controller('redirectCtrl', function($location) {
$location.path('/sign_in')
})
.controller('redirectCtrl1', function($location) {
$location.path('/sign_up')
})

My signin.html is located in /assets/templates/signin.html When i try to load the page, i dont get the rendered page, but instead i get this

window.AngularRailsTemplates || (window.AngularRailsTemplates = angular.module("templates", [])); window.AngularRailsTemplates.run(["$templateCache",function($templateCache) { $templateCache.put("signin.html", "\u003cdiv ng-controller=\"authenticationCtrl\"\u003e\n\t\u003cdiv\u003e\n\t \u003ch1\u003eLogin\u003c/h1\u003e\n\t\u003c/div\u003e\n\t\u003cdiv\u003e\n\t\t\u003cdiv\u003e\n\t\t \u003cdiv\u003eEmail: \u003cinput ng-model=\"email\" type=\"email\" /\u003e\u003c/div\u003e\n\t\t \u003cdiv\u003ePassword: \u003cinput type=\"password\" ng-model=\"password\" /\u003e\u003c/div\u003e\n\n\t\t \u003cbutton ng-click=\"login()\" \u003eLogin\u003c/button\u003e\n\t\t\u003c/div\u003e\n\t\u003c/div\u003e\t\t\t\t\n\u003c/div\u003e\n"); }]);

Any solution to my problem? Thanks in advance

Update 1: Ok,so i have changed the following things,

angular.module('authentication', ['authenticationModule','ngRoute','templates'])
    .config(['$routeProvider',function($provider){
        $provider
            .when('/sign_in', { templateUrl: 'assets/signin.html', controller: 'redirectCtrl'})

            .when('/sign_up', { templateUrl: 'assets/signup.html', controller: 'redirectCtrl1'})
    }])
    .controller('redirectCtrl', function($location) {
        // $location.path('/sign_in')
    })
    .controller('redirectCtrl1', function($location) {
        // $location.path('/sign_up')
    })

And here is what i get now, the template loads but with some extra stuff that i dont need http://postimg.org/image/iuhy9dflj/

SoluableNonagon · Accepted Answer · 2014-05-05 17:47:01Z

0

remove the / before assets, and point to the templates folder

angular.module('authentication', ['authenticationModule','ngRoute','templates'])
.config(['$routeProvider',function($provider){
$provider
.when('/sign_in', { templateUrl: 'assets/templates/signin.html', controller: 'redirectCtrl'})
.when('/sign_up', { templateUrl: 'templates/signup.html.erb', controller: 'redirectCtrl1'})
.controller('redirectCtrl', function($location) {
$location.path('/sign_in')
})
.controller('redirectCtrl1', function($location) {
$location.path('/sign_up')
})

answered May 5, 2014 at 17:47

SoluableNonagon

11.8k11 gold badges59 silver badges100 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

angular routing and templating issue

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related