是Angular JS的本地安装或参考URL之间的区别

Question

我正在尝试使用angular js开发应用程序。它是一个简单的路由。当我通过如下网址通过URL添加angular时：

<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>

Answer 1

您需要将引用添加到模块所依赖的模块（角度路由模块）。 该错误表明$ routeProvide对它来说是未知的，并且可以在角度路由模块中使用。

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

是Angular JS的本地安装或参考URL之间的区别

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-04-27 14:23:17

是Angular JS的本地安装或参考URL之间的区别

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-04-27 14:23:17

解决方案1
0 已采纳 2016-04-27 14:23:17