Angular inline template 404 not found in drupal page

Question

I'm serving an angular router in a drupal 7 page. The same example works fine in this fiddle: http://jsfiddle.net/laurencefass/Lsu8p124/.

HTML

<script type="text/ng-template" id="embedded.home.html">
  <h1> Home </h1>
</script>

<script type="text/ng-template" id="embedded.about.html">
  <h1> About </h1>
</script>

<div ng-app="routerApp"> 
  <div id="navigation">  
  <a href="#/home">Home</a>
  <a href="#/about">About</a>
  </div>
  <div ng-view></div>
</div>

Javascript

var app=angular.module('routerApp', ['ngRoute']);

app.controller('HomeController', function ($scope) {});
app.controller('AboutController', function ($scope) {});
app.config(function ($routeProvider) {
    $routeProvider.
    when('/home', {
       templateUrl: "embedded.home.html",
       controller: 'HomeController'
    }).
    when('/about', {
       templateUrl: 'embedded.about.html',
       controller: 'AboutController'
    }).
    otherwise({
        redirectTo: '/home'
    });
});

I get the following runtime error:

Community · Accepted Answer · 2017-05-23 11:58:39Z

0

The scripts need to be inside the ng-app div for inline scripts to work otherwise angular is looking for a file. not the best implementation, nor obviously documented, but it works for testing purposes. Using Inline Templates in Angular

edited May 23, 2017 at 11:58

CommunityBot

11 silver badge

answered Oct 22, 2015 at 11:32

Laurence Fass

1,9926 gold badges28 silver badges58 bronze badges

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

Collectives™ on Stack Overflow

Angular inline template 404 not found in drupal page

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related