angular.js - angularjs中路由的HTML5模式下的URL问题
PHP中文网
PHP中文网 2017-04-17 15:04:31
0
1
792

在angularjs的路由中使用HTML5模式,结果无法加载模版(templateUrl没有发送http请求),而且URL中还出现的转义。但使用标签模式时一切OK,求大佬告知?
<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<base href="/" >
<title>Title</title>
<script src="angular.min.js"></script>
<script src="angular-route.min.js"></script>
<script>
    angular.module('myApp',['ngRoute'])
            .config(['$routeProvider','$locationProvider',function($routeProvider,$locationProvider){
                $locationProvider.html5Mode(true);
                $routeProvider
                        .when('/first',{
                            controller:'firstCtrl',
                            templateUrl:'1.html'
                        })
                        .when('/second',{
                            controller:'secondCtrl',
                            templateUrl:'2.html'
                        })
                        .otherwise({
                            redirectTo:'/first'
                        });
            }])
            .controller('myController',function($scope,$http,$window){

            })
            .controller('firstCtrl',function($scope,$http){

            })
            .controller('secondCtrl',function($scope,$http){

            });
</script>

</head>
<body ng-app="myApp" ng-controller="myController">
<p>

<a href="#/first">first</a>
<a href="#/second">second</a>

</p>
<p ng-view></p>
</body>
</html>

PHP中文网
PHP中文网

认证高级PHP讲师

모든 응답(1)
Peter_Zhu

디렉토리 구조

템플릿 1 - template/1.html

으아악

템플릿 2 - template/1.html

으아악 으아악

추가로 ui-router 사용을 권장합니다

참고자료

  • Angularjs html5mode 모드 라우팅

  • Angular Routing으로 제거된 URL의 # 숫자

최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿