2014-06-30 116 views
1

我對angular js非常陌生。 我已經實現路由的角度JS,但它不重定向我我在route.js 這裏已經指出的網頁是代碼: Route.js路由在angularjs中不起作用

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

sampleApp.config(['$routeProvider', 
    function($routeProvider) { 
$routeProvider. 
    when('/getplaces', { 
    templateUrl: 'getplaces.html', 
    controller: 'ListCtrl', 

    }). 
    when('/getuncategorisedplaces', { 
    templateUrl: 'list.html', 
    controller: 'uncatCtrl' 
    }) 
    .otherwise ({ 
redirectTo: '/getplaces' 
    }); 

}]); 

Controller.js

function uncatCtrl($scope, $http) { 
    $http.get('http://94.125.132.253:8000/getuncategorisedplaces').success(function (data) { 
    $scope.places = data; 
    console.log(data); 
    } 
    )} 
// get places 
    function ListCtrl($scope, $http) { 
    $http.get('http://94.125.132.253:8000/getplaces').success(function (data) { 

    $scope.places = data; 
    console.log("Successful") 
console.log(data); 
    } 
)} 

HTML代碼包括NG視圖和HREF如HREF = 「#getplaces」

<body ng-app="sampleApp" > 
<div class="container"> 
    <div class="row"> 
    <div class="col-md-3"> 
     <ul class="nav"> 
      <li> <a class= "linha" href="#getplaces"> Get places </a></li> 
      <li><a class= "linha" href="post.html"> Post a movie </a></li> 
          <li><a class= "linha" href="#getuncategorisedplaces">List of uncategorised places </a></li> 
     </ul> 
    </div> 
    <div class="col-md-9"> 
     <div ng-view></div> 

    </div> 

    </div> 

回答

1

檢查你有兩個腳本包括d(角和ngroute)

<script src='angular.js'> 
<script src='angular-route.js'> 

然後檢查要包括在你的應用程序,模塊:

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

作爲角1.2.0的,角路由是一個獨立的模塊

參考角文檔:

https://docs.angularjs.org/api/ngRoute

+0

我已經添加了它,它不起作用。我正在使用的文件可以在「http://creative.coventry.ac.uk/~4078078/Test%20codes/index.html#/getuncategorisedplaces」 – butYouDontLookLikeADeveloper

+0

檢查hrefs。將它們更改爲「/ getplaces」和「/ getuncategorisedplaces」。 – avidenic

+0

我從#getplaces中將它們更改爲/ getplaces時出現錯誤,表示未找到 – butYouDontLookLikeADeveloper

0

他re是我剛纔寫的一個示例代碼。

var app = angular.module('test', ['ngRoute','ngGrid','ngBootstrap', 'http-auth-interceptor','ui.bootstrap','ngCookies','ngSanitize']). 
config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
     when('/sign-in', {templateUrl: 'partials/login/signin.html', controller: LoginCtrl}). 
     when('/admin/sign-in', {templateUrl: 'partials/login/userManagementSignin.html', controller: LoginCtrl}). 
     otherwise({redirectTo: '/dashboard'}); 
}]);