Mặc dù câu hỏi đã thường được trả lời, đây là một chút Ngoài nhắm mục tiêu các ví dụ cụ thể được sử dụng trong câu hỏi:
Làm thế nào để sử dụng một hằng số góc để xác định baseUrl của partials của bạn (hoặc để xác định hằng số khác đại diện cho các giá trị máy chủ và làm cho chúng có sẵn cho cấu hình):
// file: app.js
'use strict';
/* App Module */
angular.module('myApp', [])
// define the templateBaseUrl
.constant('templateBaseUrl', 'themes/angular/partials/');
// use it in configuration
.config(['$routeProvider','templateBaseUrl', function($routeProvider,templateBaseUrl) {
$routeProvider
.when('/posts', {
templateUrl : templateBaseUrl + 'post-list.html',
controller : PostListCtrl
})
.when('/posts/:postId-:slug', {
templateUrl : templateBaseUrl + 'post-view.html',
controller : PostViewCtrl
})
.when('/about', {
templateUrl : templateBaseUrl + 'about.html',
controller : AboutPageCtrl
})
.when('/contact', {
templateUrl : templateBaseUrl + 'contact.html',
controller : ContactPageCtrl
})
.otherwise({
redirectTo: '/posts'
})
;
}]);
Theo tôi, điều này có một số lợi ích:
- Nếu bạn di chuyển quan điểm của bạn, bạn chỉ cần cập nhật mã của bạn trong một địa điểm duy nhất
- Nếu partials của bạn được lồng nhau sâu sắc trong cách bố trí dự án của bạn, "templateBaseUrl" không gây ra càng nhiều tiếng ồn như toàn bộ con đường sẽ
- Bạn thậm chí có thể thay đổi giữa đường dẫn tương đối và tuyệt đối
- An answer to a similar question đề xuất sử dụng phần tử cơ sở của html để loại bỏ nhu cầu thêm baseUrl vào mỗi mẫuUrl. Nhưng điều này cũng ảnh hưởng đến tất cả các tài nguyên khác trên trang web. Chỉ định cấu hình url cơ sở cho các mẫu không có tác dụng phụ
Nói chung, tôi không sử dụng giải pháp này với giá trị mã hóa cứng như trên. Nó chỉ là một ví dụ để hiển thị những gì phải làm theo cách đơn giản nhất. Để có thể sao chép ứng dụng của bạn xung quanh trên máy chủ của bạn, xác định giá trị bên ngoài của app.js, trong tập tin chỉ mục của bạn và tạo ra cần thiết bên pathes server:
// file: index.php
<?php
// only depends on your project layout
$angularPartialsBaseUrl = 'themes/angular/partials/';
// this will change when you move the app around on the server
$themeBaseUrl = $_SERVER['REQUEST_URI'] . 'themes/angular';
?><!DOCTYPE html>
<html ng-app="myApp">
<head>
<title>Yii Blog Demo</title>
<script>
var myNS = myNS || {};
myNS.appConfig = myNS.appConfig || {};
myNS.appConfig.templateBaseUrl = '<?php echo $angularPartialsBaseUrl; ?>';
</script>
<script src="<?php echo $themeBaseUrl; ?>/js/vendor/angular/angular.js"></script>
<script src="<?php echo $themeBaseUrl; ?>/js/app.js"></script>
</head>
[...]
Và trong app.js:
// file: app.js
'use strict';
/* App Module */
angular.module('myApp', [])
// define the templateBaseUrl using external appConfig
.constant('templateBaseUrl', myNS.appConfig.templateBaseUrl);
Nhìn vào câu trả lời này: http://stackoverflow.com/questions/17011616/using-a-relative-path-for-a-service-call-in-angularjs/17112017#17112017 Tôi nghĩ rằng đó là một giải pháp tốt hơn. –