ng-route가 작동하지 않습니다.

Question

ng-route로 코드에 문제가 있습니다. 브라우저의 주소는 변경되지만 내 페이지의 모든 요소는 여전히 동일합니다. 나는 간단한 문단 세 개의 하위 사이트가

var app=angular.module('mainApp',['ngRoute']); 
 
app.config('$routeProvider', function($routeProvider){ 
 
    $routeProvider 
 
     .when('/',{ 
 
      templateUrl: 'home.html' 
 
     }) 
 
     .when('/about', { 
 
      templateUrl: 'about.html' 
 
     }) 
 
     .when('/contact', { 
 
      templateUrl: 'contact.html' 
 
     }) 
 
     .otherwise({ 
 
\t \t \t redirectTo: '/' 
 
\t \t \t }); 
 
}); 
 

 
app.controller('mainCtrl',function($scope){ 
 

 
    });

<div ng-controller="mainCtrl"> 
 
\t <div> 
 
\t \t <nav> 
 
\t \t \t <ul> 
 
\t \t \t \t <li><a href="#/">Home</a></li> 
 
\t \t \t \t <li><a href="#/about">About us</a></li> 
 
\t \t \t \t <li><a href="#/contact">Contact</a></li> 
 
\t \t \t </ul> 
 
\t \t \t </nav> 
 
\t </div> 
 
\t <br/> 
 
\t <div ng-view ></div> 
 
</div>

: 여기 내 코드입니다 (집에 대한 접촉을 HTML.).

도와 주시겠습니까?

Answer 1

당신은 Desktop/SS/index.html#/는 메인 페이지입니다 언급. Therin은 당신 문제를 안고 있습니다.

HTTP 서버를 통해 페이지를 제공하지 않으면 라우팅이 작동하지 않습니다. 파일 시스템에서 HTML 페이지를 정적으로 보면 불행하게도 작동하지 않습니다.

시스템에 파이썬이있는 경우, 이것을 쉽게 테스트 할 수 있습니다 : 명령 프롬프트를 열고 Desktop/SS/ 디렉토리로 변경하십시오. 그런 다음 python -m SimpleHTTPServer 8080을 실행하고 브라우저에서 http://localhost:8080으로 이동하십시오. 그 방법으로 완벽하게 작동해야합니다.

Answer 2

대신 app.config('$routeProvider', function ($routeProvider)

스크립트의 app.config(function ($routeProvider)를 사용하십시오 :

var app=angular.module('myApp',[]); 
app.config(function($routeProvider){ 
    $routeProvider 
     .when('/',{ 
      templateUrl: 'home.html' 
     }) 
     .when('/about', { 
      templateUrl: 'about.html' 
     }) 
     .when('/contact', { 
      templateUrl: 'contact.html' 
     }) 
     .otherwise({ 
      redirectTo: '/' 
      }); 
}); 

app.controller('mainCtrl',function($scope){ 

    }); 

Demo Fiddle : 코멘트에 https://jsfiddle.net/jLdce3vj/43/