Đây là tập tin .htaccess của tôi:
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) /index.html [NC,L]
Đây là app.js
var app = angular.module('router', ['ngRoute']);
app.controller('main', function($scope, $location, $routeParams){
$scope.test = 'testing';
$scope.theID = $routeParams.theID;
});
// Routing Configuration
app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider
.when('/about', {
templateUrl: 'views/about.html'
})
.when('/paramtest/:theID', {
templateUrl: 'views/aboutID.html',
controller: 'main'
})
.otherwise({
templateUrl: 'views/home.html'
});
$locationProvider.html5Mode(true);
}]);
Đây là aboutID.html
ID: {{theID}}
Khi tôi truy cập http://domain.com/about
, nó hoạt động rất tốt, ngay cả khi tôi thực hiện làm mới cmd + r nó vẫn tải trang phạt.
Nếu tôi nhấp vào liên kết từ trong ứng dụng và truy cập http://domain.com/paramtest/1234
thì nó hoạt động tốt.
Vấn đề là nếu tôi cố gắng đi thẳng đến http://domain.com/paramtest/1234
hoặc làm một refresh cứng http://domain.com/paramtest/1234
định tuyến góc không còn hoạt động và tất cả các biến được outputted như thế này {{var}}
Tôi cũng có thẻ <base href="/">
tại chỗ.
- additonal FILES -
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Contractors</title>
<link href='http://fonts.googleapis.com/css?family=Quicksand:400,300,700' rel='stylesheet' type='text/css'>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet" type="text/css">
<link href="styles/datepicker.css" rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet" type="text/css">
<link href="styles/classic.date.css" rel="stylesheet" type="text/css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.0.1/dropzone.css" rel="stylesheet" type="text/css">
<link href="js/ng-sortable.min.css" rel="stylesheet" type="text/css">
<link href="js/jquery.fancybox.css" rel="stylesheet" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://cdn.firebase.com/js/client/2.2.2/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/1.0.0/angularfire.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-animate.js"></script>
<script type="text/javascript" src="js/angular-datepicker.js"></script>
<script type="text/javascript" src="app.js"></script>
<base href="/">
</head>
<body ng-app="bidder" ng-controller="main" flow-drag-enter="style={border: '5px solid green'}">
<div class="header" ng-controller="main">
<div class="logo">
<a href="/"><img src="images/logo.png"></a>
</div>
</div>
<!-- MAIN CONTENT -->
<div ng-view ng-controller="main" class="view-animate" ng-if="firebaseUser"></div>
<div class="profileSection" ng-if="firebaseUser" ng-controller="main">
<div class="profileTopLeft">
<img src="thumb.php?w=30&h=30&src=uploads/{{user.profilePicture || noPicture.png}}" ng-if="user.profilePicture" class="profilePicTop">
<i class="fa fa-user" ng-if="!user.profilePicture"></i>
<b>{{user.Name}}</b> <small>{{user.Email}}</small>
</div>
<div class="profileTopRight">
<a href="profile"><i class="fa fa-th-list"></i> My Profile</a>
<a href ng-click="logoutUser()"><i class="fa fa-sign-out"></i> Logout</a>
</div>
</div>
<!-- REGISTRATION -->
<div ng-if="!firebaseUser" ng-controller="main">
<loginregister></loginregister>
</div>
<div class="clear" style="height: 100px;"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.fancybox.js"></script>
<script type="text/javascript" src="js/jquery.expander.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.0.1/dropzone.js"></script>
</body>
</html>
Routing phân đoạn từ app.js
// PAGE SETUP
app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider
.when('/about', {
templateUrl: 'views/about.html'
})
.when('/findcontractor', {
templateUrl: 'views/findcontractor.html'
})
.when('/editjob/:jobID', {
templateUrl: 'views/editjob.html'
})
.when('/viewcandidates/:jobID/:validate', {
templateUrl: 'views/viewcandidates.html'
})
.when('/messenger/:creatorID/:jobID/:candidateID', {
templateUrl: 'views/messenger.html'
})
.when('/profile', {
templateUrl: 'views/profile.html'
})
.when('/findwork', {
templateUrl: 'views/findwork.html'
})
.otherwise({
templateUrl: 'views/home.html'
});
$locationProvider.html5Mode(true);
}]);
Bình thường url như http://domain.com/about/
công việc một cách hoàn hảo, nhưng bất kỳ trang tham số don' t làm việc trên một làm mới khó khăn, nó hoặc là trả về 404 hoặc index.html mà không có bất kỳ javascript bao gồm.
lỗi nào được đưa ra? Bạn có thẻ ' '? –
charlietfl
bạn có gặp lỗi 404 không? – Yousuf
Có Tôi có một thẻ cơ sở, không có tôi không nhận được lỗi 404, không có biến nào trong màn hình Góc, tôi không nhận được bất kỳ thông báo lỗi nào nhưng có vẻ như phạm vi đã hoàn toàn biến mất. – Jordash