Угловой маршрут не работает.

Я изучаю angularJS.i пытался реализовать код из учебного видео, чтобы отобразить представление на странице html с помощью Route, но, видимо, я застрял, хотя im делает то же самое, что и наставник, показывается в учебнике, но у меня нет разгадка, почему он не работает, я искал в Интернете, но invain, пожалуйста, кто-нибудь pointout мой mistake.here мой кодУгловой маршрут не работает.

Index.html

<html ng-app="App"> 
<head> 
<link href="css/style.css" rel="stylesheet" type="text/css"> 

</head> 
<body> 
    <div ng-view></div> 
    <script src="js/angular.js"></script> 
    <script src="js/angularRoute.js"></script> 
    <script src="App/Myapp.js"></script> 
    <script src="App/CustomerController.js"></script> 

</body> 
</html>

App/MyApp.js

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

App.config(function($routeprovider) 
      { 
    $routeprovider 
     .when('/',{ 
     controller:'CustomerController', 
     templateUrl:'App/views/customers.html' 
    }) 
    .otherwise({ redirectTo:'/'}); 

});

просмотров/customers.html

<div class="heading"> 
     <h1>Customers List</h1> 
    </div> 
    <div class="filterBox"> 
    Filter:<input type="text" ng-model="CustomerFilter.name"/> 
    </div> 
    <table> 
     <th ng-click="sorter='CustomerID';reverse=!reverse">ID</th> 
     <th ng-click="sorter='name';reverse=!reverse">Name</th> 
     <th ng-click="sorter='city';reverse=!reverse">City</th> 
     <th ng-click="sorter='total_orders';reverse=!reverse">Total   Orders</th> 
     <th ng-click="sorter='date';reverse=!reverse">Date of last Order</th> 
    <tr ng-repeat="cust in customers |filter:CustomerFilter|orderBy:sorter:reverse"> 
     <td>{{ cust.CustomerID }}</td> 
     <td>{{ cust.name|uppercase }}</td> 
     <td>{{ cust.city |lowercase}}</td> 
     <td>{{ cust.total_orders|currency:'Rs' }}</td> 
     <td>{{ cust.date|date:'longDate' }}</td> 
     </tr> 
    </table> 
    <span> Total Customers:{{customers.length}}</span>

У меня есть контроллер с именем CustomerController, который я не вставленное здесь, потому что beacuase это будет слишком большой, чтобы соответствовать.

источник

2016-07-03 Bilal Alam

опечатка, не забудьте записать р в столице

$routeProvider

источник

2017-01-13 12:25:43

Я подозреваю, что это ошибка URL. Просто потому, что если ваш app.js находится внутри папки приложения, вам не нужно иметь «приложение» в своих URL-адресах, если у вас нет макета папки приложения/приложения/представлений.

В app.js ваш templateurl должен быть просто 'кажд/customers.html'

Вы также можете проверить index.html. У вас есть контроллеры в приложении? Или в папке с скриптами или что-то похожее?

источник

2016-07-03 00:33:41

я eidited мою URL-адрес несколько раз, но invain, мой контроллер находится в том же файле, где MyApp.js является –

Да, мои проекты созданы по-другому, привести меня к неправильному пути. Кстати, предположим, что ваша опечатка была на '$ rubeprovider', тогда это должно было вызвать сообщение об ошибке в вашей консоли браузеров (например, «Неизвестный поставщик: $ rubeprovider»), что ускорило бы вашу охоту за ошибками. Отправьте ответ на свой вопрос, а не оставите его без ответа. –

Да, вы указали правильно, моя опечатка была $ roplyprorovider. –

1: Хорошо, проблема в том, что у вас нет контроллера в ur customer.html странице, и вам нужно сообщить частичный вид ур о контроллере. U может просто обернуть ur всю страницу между тегом div с контроллером, как показано ниже.

<div controller="CustomerController> 
// ur data of customer.html page goes here 
</div>

2: Лучше заявить о своей конфигурации, как это не будет никаких проблем в вашем приложении, когда вы его минимизируете.

App.config(['$routeProvider', function($routeProvider) 
{ 
    // routerProvider goes here 
}]);

источник

2016-07-03 01:08:19 Wcan

все еще не работает ... –

, если нам нужно отследить контроллер в представлении, то почему мы ссылаемся на контроллер на первом месте? –

скажите, пожалуйста, какая именно ошибка вы получаете в консоли? – Wcan

поэтому ошибка была опечатка в myApp.js на $ routeprovider, ошибка это генерируется на консоли был «Неизвестный поставщик: $ routeprovider». исправленная версия - $ routeProvider, не забывайте о капитале людей P.

источник

2016-07-10 11:48:52

Угловой маршрут не работает.

ответ

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