2015-04-15 3 views
1

Im не уверен, где разместить папку partials, содержащую html-виды! Я поместил его в корневую папку приложения, в представлениях и публично. Также попытался удалить первый трейлинг-косой чертой templateUrl, но ничего. Я также пытался (как вид загрузки контейнера):Угловой вид не загружается

<div ng-view></div> 
<ng-view></ng-view> 
<div data-ng-view></div> 
<div ng-view=""></div> 
<div ng-view="demoApp"></div> 

Это просто пример обучения держит модуль с 2 контроллерами и 2 видами.

Вот SPA (эта страница отображается в разгроме '/' проекта танцовщик (Perl)):

<!DOCTYPE html> 
<html ng-app="demoApp"> 
    <head> 
    <title><% title %></title> 
    <link rel="stylesheet" href="/customised_bootstrap/css/bootstrap.css"> 
    <script src="/bower_components/underscore/underscore.js"></script> 
    <script src="/bower_components/backbone/backbone.js"></script> 
    <script src="/bower_components/angular/angular.js"></script> 
    <script src="/bower_components/angular-resource/angular-resource.js"></script> 
    <script src="/bower_components/angular-route/angular-route.js"></script> 
    <script src="/bower_components/ng-tasty/ng-tasty-tpls.js"></script>  

    <script> 
     //define a module 
     var demoApp = angular.module('demoApp', ['ngRoute']); 

     //define routes for our module(each route will have its set of views and controllers) 
     demoApp.config =(function ($routeProvider) { 
     $routeProvider 
      .when('/', 
      { 
       controller: 'simpleController1', 
       templateUrl: '/partials/testAlexView1.html' 
      }) 
      .when('/testAlexView1', 
      { 
       controller: 'simpleController2', 
       templateUrl: '/partials/testAlexView1.html' 
      }) 
      .when('/testAlexView2', 
      { 
       controller: 'simpleController2', 
       templateUrl: '/partials/testAlexView2.html' 
      }) 
      .otherwise({redirectTo: '/partials/testAlexView1.html'}); 
     }); 

     //define a controller within our module 'demoApp' 
     demoApp.controller('simpleController1', function ($scope) { 
     $scope.customers = [ 
      {name:'Boris', age:'18'}, 
      {name:'Claudia', age:'28'}, 
      {name:'Carlos', age:'39'}, 
      {name:'Ben', age:'25'} 
     ]; 
     //var stuff ={}; 
     }); 

     demoApp.controller('simpleController2', function ($scope) { 
     $scope.customers = [ 
      {name:'Alex', age:'18'}, 
      {name:'Albert', age:'28'}, 
      {name:'Anthony', age:'39'}, 
      {name:'Loren', age:'25'} 
     ]; 
     }); 
    </script> 

    </head> 

<body> 
    <div> 
    <p>Main page of SPA test</p> 
     <div ng-view></div> 
    </div> 
</body> 
</html> 

Вот два одинаковых просмотров:

testAlexView1.html (testAlexView2. HTML является то же самое):

<div> 
    <input type="text" data-ng-model="name" /> {{ name }} 
    <br /> 
    <ul> 
    <li data-ng-repeat="customer in customers | filter:name | orderBy:'age'"> 
     {{customer.name}} - {{customer.age}} 
    </li> 
    </ul> 
</div> 

В инспекторе браузера, в DIV, где вид должен загрузить все, что появляющийся (как на корень или корень #/view.html):

<!-- ngView: --> 

Batarang не обнаруживает никаких областей и модулей. Спасибо за любую помощь!

+0

иначе маршрут указывает на шаблон в то время как он должен быть направлен на маршрут. – Bernardmoes

ответ

2

Там, кажется, опечатка в вашей конфигурации здесь:

demoApp.config =(function ($routeProvider) { 

Вместо этого попробуйте:

demoApp.config(function ($routeProvider) { 
+0

Удивительный, спасибо! –

Смежные вопросы