NgRoute не работает в jsfiddle

Я новичок в angular и собираюсь написать свое первое приложение hello world на jsfidlle. Мне удалось загрузить контент с помощью ng-include, но у меня все еще есть проблема с использованием ngRoute: я получаю

Невозможно прочитать свойство 'insertBefore' неопределенного

в следующем коде: HTML

<div ng-app="myApp">
  <a href="#/firstPanel">1Panel</a>
  <a href="#/secondPanel">2Panel</a>
  <div ng-include src="'main.html'"><div>
  <div ng-view></div>

  <script type="text/ng-template" id="first_panel.html">
    First Panel
  </script>
  <script type="text/ng-template" id="second_panel.html">
    Second Panel
  </script>
  <script type="text/ng-template" id="main.html">  
    <div ng-controller="MainCtrl as mainCtrl">
      Main {{mainCtrl.foo}} <br/>
      <input type="text" ng-model="mainCtrl.foo"/>
      <br/>
    </div>
  </script>
</div>

JS

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

var my = {};

my.MainCtrl = function() {
  this.foo = 'foo';
}

my.SecondPanelCtrl = function() {
}

my.FirstPanelCtrl = function() {
}

var routeProvider = function($routeProvider) {
  $routeProvider.
      when('/firstPanel', {
        templateUrl: 'first_panel.html',
        controller: 'FirstPanelCtrl',
        controllerAs: 'firstPanelCtrl'
      }).
      when('/secondPanel', {
        templateUrl: 'second_panel.html',
        controller: 'SecondPanelCtrl',
        controllerAs: 'secondPanelCtrl'
      }).
      otherwise({redirectTo: '/firstPanel'});
};

myApp.config(routeProvider);

// register all controllers
myApp.controller('MainCtrl', my.MainCtrl);

myApp.controller('FirstPanelCtrl', my.FirstPanelCtrl);
myApp.controller('SecondPanelCtrl', my.SecondPanelCtrl);

А вот мой jsfiddle:

http://jsfiddle.net/ccTd6/14/


person Le_Coeur    schedule 24.05.2014    source источник
comment
В последнее время я вижу много проблем с запуском ng в jsfiddle. Даже простые примеры не работают. Возможно, вам лучше использовать plnkr.co.   -  person gat    schedule 24.05.2014
comment
Странный. Я довольно широко использую jsFiddle с AngularJS и не сталкиваюсь с какими-либо проблемами.   -  person gkalpak    schedule 24.05.2014


Ответы (1)


Это ошибка в вашем синтаксисе HTML, которая все портит:

<div ng-include src="'main.html'"></div>
                                   ^
          here you missed the `/`__|

Примечание:
По крайней мере, в Chrome, который я пробовал, именно браузер путается и полностью удаляет ngView div, так что в любом случае это не вина Angular.

person gkalpak    schedule 24.05.2014
comment
Спасибо, как-то проверял несколько раз, но пропустил, новая пара глаз всегда хороша :) - person Le_Coeur; 24.05.2014