1

我只是想學習Angular.Js,並在這裏看到一個教程卡住了。 我剛剛使用下面的代碼創建了一個演示應用程序...並且出現以下錯誤。任何幫助將不勝感激。routing提供沒有找到AngularJs

Error: [$injector:modulerr] Failed to instantiate module demoApp due to:  [$injector:unpr] Unknown provider: $routeProvider 



    <!doctype html> 
<html lang="en" data-ng-app="demoApp"> 
<head> 

    <meta charset="utf-8"> 
    <title>My HTML File</title> 
    <link rel="stylesheet" href="css/app.css"> 
    <link rel="stylesheet" href="css/bootstrap.css"> 


</head> 
<body> 

<!-- Placeholder for views --> 

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

<script src="lib/angular/angular.js"></script> 
<script src="lib/angular/angular-route.js"></script> 

<script> 

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

    demoApp.config(function ($routeProvider){ 
    $routeProvider 
    .when('/', 
     { 
     controller: 'SimpleController', 
     templateUrl: 'partials/view1.html' 
     }) 
    .when('/view2', 
     { 
     controller: 'SimpleController', 
     templateUrl: 'partials/view2.html' 
     }) 
    .otherwise({ 
     redirectTo: '/' 
    }) 
    }); 



    function SimpleController($scope) 
    { 
    $scope.customers=[ 
     {name:'AB',city:'Glasgow', cash:20}, 
     {name:'CD',city:'United States', cash:30}, 
     {name:'EF',city:'India', cash:40} 
    ]; 

    $scope.addCustomer = function(){ 
     $scope.customers.push({ 
     name: $scope.newCustomer.name, 
     city: $scope.newCustomer.city, 
     cash: $scope.newCustomer.cash 
     }); 
    }; 

    } 


    demoApp.controller('SimpleController', SimpleController); 

</script> 

</body> 

</html> 

view1.html

<div class="container"> 

    <h2>View1</h2> 
    </br> 
    Name: 
    <br/> 
    <input type="text" data-ng-model="filter.name" /> 
    </br> 
    <ul> 
     <li data-ng-repeat="cust in customers | filter:filter.name"> {{ cust.name }} - {{ cust.city }} - {{ cust.cash | currency:{£} }} </li> 
    </ul> 

    </br> 
    Customer name: </br> 
    <input type="text" dta-ng-model="newCustomer.name" /> 
    </br> 

    City: </br> 
    <input type="text" data-ng-model="newCustomer.city" /> 
    </br> 

    Cash: </br> 
    <input type="text" data-ng-model="newCustomer.cash" /> 
    </br> 

    <button type="button" data-ng-click="addCustomer()" value="Add Customer" /> 
    <a href="#/view2">View 2</a> 
</div> 
+1

如果使用外部非核心模塊需要將其添加爲依賴你,當你創建你的主模塊的空數組英寸我看到你有'routing-js'被加載...如果這是外部模塊需要注入它作爲依賴 – charlietfl

+0

@charlietfl偉大的...解決了這個問題 – Deep

+0

是的,他們將路由位從1.0之間的核心分開。 8和1.2。切換到1.0.8也解決了這個問題,但我認爲留在1.2分支是一個好主意,因爲它似乎接近現在發佈。 – ivarni

回答

0

感謝修復@charlietfi。語法注入路由到您的demoApp在角版本1.2及以上的爲:

<script> 

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

... 
0

添加ngRoute扶養的模塊中。

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

還包括角route.js

<script type="text/javascript" src="angular-route.js"></script> 
相關問題