разница между локальной установкой или ссылочным URL углового js

0

Я пытаюсь разработать приложение, используя угловые js.it простая маршрутизация. Когда я добавляю угловое значение по URL-адресу:

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="~/js/app.js"></script>

Мое приложение отлично работает, но когда я добавляю так:

<script src="~/Scripts/angular.min.js"></script>
<script src="~/Scripts/angular-route.min.js"></script>
<script src="~/js/app.js"></script>

Я получил эту ошибку:

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module sampleApp due to:
Error: [$injector:unpr] Unknown provider: $routeProvide

Вот мой app.js

//Define an angular module for our app
var sampleApp = angular.module('sampleApp', []);

//Define Routing for app
//Uri /AddNewOrder -> template add_order.html and Controller AddOrderController
//Uri /ShowOrders -> template show_orders.html and Controller AddOrderController
sampleApp.config(['$routeProvider',
  function ($routeProvider) {
      $routeProvider.
        when('/AddNewOrder', {
            templateUrl: 'templates/add_order.html',
            controller: 'AddOrderController'
        }).
        when('/ShowOrders', {
            templateUrl: 'templates/show_orders.html',
            controller: 'ShowOrdersController'
        }).
        otherwise({
            redirectTo: '/AddNewOrder'
        });
  }]);


sampleApp.controller('AddOrderController', function ($scope) {

    $scope.message = 'This is Add new order screen';

});


sampleApp.controller('ShowOrdersController', function ($scope) {

    $scope.message = 'This is Show orders screen';

});

Вот мой html-код:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>AngularJS Routing example</title>
</head>

<body ng-app="sampleApp">

    <div class="container">
        <div class="row">
            <div class="col-md-3">
                <ul class="nav">
                    <li><a href="#AddNewOrder"> Add New Order </a></li>
                    <li><a href="#ShowOrders"> Show Order </a></li>
                </ul>
            </div>
            <div class="col-md-9">
                <div ng-view></div>
            </div>
        </div>
    </div>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="~/js/app.js"></script>
</body>
</html>
  • 0
    Вы уверены, что файл находится там. Что показывает сетевая панель?
  • 0
    @epascarello да файл есть, я установил, что с помощью Nuget в VS
Показать ещё 4 комментария
Теги:

1 ответ

0
Лучший ответ

Вам нужно будет добавить ссылку на модуль (модуль углового маршрута), от которого зависит ваш модуль. Ошибка говорит, что $ routeProvide ему неизвестен и доступен в модуле углового маршрута.

//Define an angular module for our app
var sampleApp = angular.module('sampleApp', ['ngRoute']);
Поделиться
  • 0
    Я добавил ваш ответ, но получаю следующие ошибки: Uncaught Error: Нет модуля: ngRoute и Uncaught TypeError: window.angular. $$ csp не является функцией angular.min.js: 17 Uncaught Error: Нет модуля: ngRoute
  • 0
    Это означает, что файл angular-route.min.js не загружается. Проверьте вашу ссылку и / или с помощью инструментов разработчика браузера о том, почему этот файл .js отсутствует.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню