AngularJS : ngRoute Not Working

이 간단한 라우팅이 제대로 작동하려면 문제가 무엇인지 파악할 필요가 없습니다.AngularJS : ngRoute Not Working

<html lang="en" ng-app="app"> 
 
    . 
 
    . 
 
    . 
 
    <a href="#voip"> 
 
     <div class="col-lg-3 service"> 
 
     <img src="assets/img/voip.svg"/> 
 
     <h4 ng-bind-html="content.home.voip_header"></h4> 
 
     <p ng-bind-html="content.home.voip_txt"></p> 
 
     </div> 
 
    </a> 
 

 
    <section id="view"> 
 
     <div ng-view></div> 
 
    </section>

이 라우팅은 다음과 같습니다 : 나는 다음과 같이 ', 그렇지 않으면'를 지정하면

var app = angular.module('app',[ 
    'ngRoute', 
    'ngSanitize' 
]); 
    app.config(['$routeProvider',function($routeProvider){ 
     $routeProvider 
     .when('/voip',{ 
     templateUrl:'assets/templates/voip.html' 
     }); 
    }]);

템플릿은로드

이

은 HTML입니다. 어쩌면 내가 href 특성에 잘못된 구문을 사용하고 있다고 생각했지만 사방에 쳐다 보았고 이렇게해야합니다.

 .otherwise({ 
     redirectTo:'/voip' 
     })

또 다른 것은 내가 $routeChangeSuccess을들을 경우, 이벤트는 트리거, 아직 뷰가로드되지 않았습니다입니다.

아이디어가 있으십니까?

출처

2017-01-14 user3085271

어떤 각도의 각도를 사용하고 있습니까? –

브라우저에서'file/open'과 반대로 서버에서이 페이지를로드하고 있습니까? – charlietfl

각도 버전은 1.6.1입니다. 예, 페이지가 서버에서로드됩니다. 구성을 변경하지 않고 파일을 제공하는 경우에만 로컬 아파치입니다. – user3085271

그것은 당신이 1.6 각도를 사용하고 있기 때문에 적절하게 그리고 변화를 기본 해시 접두사가 있었다 :

이

인해 aa077e8에, $ 위치 해시 뱅에 사용되는 기본 해시 접두사 URL이 변경되었습니다 빈 문자열 ('')에서부터 강타 ('!'). 응용 프로그램이 HTML5 모드를 사용하지 않거나 이 HTML5 모드를 지원하지 않는 브라우저에서 실행 중이고 자신의 해시 프리픽스를 지정하지 않은 경우 클라이언트 측 URL에! 접두사. 의 경우 mydomain.com/#/a/b/c 대신 URL은 mydomain.com/#!/a/b/c가됩니다.

실제로 더 해시 접두사가없는 싶은 경우에, 당신은 응용 프로그램에 구성 블록을 추가하여 이전 동작을 복원 할 수 있습니다

appModule.config ([ '$ locationProvider', 기능 ($ locationProvider) {
$ locationProvider.hashPrefix ('');}])); 마지막으로 <a ng-href="#voip">을 변경
<base href="/"> 
: HTML 헤더에
$locationProvider.html5Mode(true); 
사실 및 HTML 세트베이스

1. 설정 HTML5mode : Source

그래서 당신은 몇 가지 옵션이 있습니다 ~

<a ng-href="voip">

2. 1.6 방법
변경
<a ng-href="#voip">

<a ng-href="#!voip">

3.1.5에서 다시 이전 동작으로 이동 - 설정 해시 접두사 1.6 AJS HTML5 +에 느낌표를 사용하여 수동으로

app.config(['$locationProvider', function($locationProvider) { $locationProvider.hashPrefix(''); }]);

출처

2017-01-14 22:45:51

첫 번째 옵션을 시도했습니다. 문제는 그대로 유지됩니다. – user3085271

[$ route에 대한 문서의 예] (https://docs.angularjs.org/api/ngRoute/service/$route)가 깨졌습니다. 옵션 1을 사용하는 것 같지만 기본 태그를 설정하지 않습니다. 이 문서를보고 이러한 옵션을 어떻게 파악할 수 있습니까? 문서의 예제가 제대로 실행되지 않으면 실망합니다. 옵션 2를 사용하면 나에게 적합하다고 생각됩니다. 감사! – Hintron

시도.

예를 들어 href = "# home"..... write href = "#! home"대신에. 4 시간 동안 헤드 스크래치를 한 후에 효과가있었습니다.

출처

2017-05-21 17:17:42

답변

관련 문제