2015-01-01 17 views
6

ứng dụng AngularJS My làm cho các cuộc gọi đến một API mà hiện nay được lưu trữ tại một dịch vụ, nhưng trước đây lưu trữ tại một khác nhau, và trong tương lai gần có thể sẽ được tổ chức nhưng ở một nơi khác.Cách tốt nhất để lưu trữ URL hoặc miền URL, trong ứng dụng AngularJS là gì?

URL được thường xuyên thay đổi. Ví dụ từ

myfirst.heroku.com/app/user/mike/profile 

để

mysecond.bluemix.com/app/user/mike/profile 

, vv

Thay vì thay đổi URL trong mỗi mọi vị trí, tôi muốn chỉ cần thay đổi một phần trước khi /app....

Trong một App góc cách tốt nhất để làm điều này là gì?

LƯU Ý: Nhiều URL tôi sử dụng trong suốt ứng dụng, nằm trong các mô-đun được thêm làm phụ thuộc vào ứng dụng chính của tôi. Vì vậy, Module1Module2 đều sử dụng các URL trong bộ điều khiển và nguồn lực của họ và sau đó được bao gồm trong MainApp. Vì vậy, một giải pháp tốt cho tôi cần phải được truy cập vào tất cả các ứng dụng phụ thuộc. Điều đó có thể không.

+0

Sử dụng .Value() hoặc .contant() và tiêm nó vào – Martin

Trả lời

12

Tôi muốn đề nghị với bạn rằng bạn phải sử dụng liên tục góc, tương tự như của nó đến một dịch vụ nhưng nó tạo ra một giá trị không đổi có thể được tiêm ở khắp mọi nơi trong dự án góc của chúng tôi.

Đây là cách chúng ta có thể tạo ra liên tục

liên tục dịch vụ:

angular.module('AppName') 
.constant('REST_END_POINT', 'https://rest.domain.com/'); 

Công dụng trong điều khiển:

angular.module('AppName') 
.controller('CTRL_NAME', ['REST_END_POINT', '$scope', function(REST_END_POINT, $scope){ 
     //your business logic. 
]); 
+0

Nếu 'AppName' có các module khác tiêm vào nó, có thể Tôi sử dụng hằng số 'REST_END_POINT' trong các mô-đun đó? – CodyBugstein

+1

Nếu bạn đang làm việc trên mô-đun AppName làm dự án của bạn và có bộ mô-đun được chèn khác với dịch vụ REST_END_POINT này có thể được sử dụng trong AppName chỉ vì dịch vụ REST_END_POINT được tạo trong mô-đun AppName để không thể truy cập bên ngoài. Nếu bạn thực sự muốn sử dụng điều này trong các module khác nhau, bạn nên tạo một module khác có tên là RestApp sẽ có dịch vụ REST_END_POINT Vì vậy, cuối cùng bạn có thể tiêm module RestApp vào bất cứ nơi nào bạn muốn giống như các module khác. – CrazyGeek

+0

Những gì tôi đã kết thúc, như CrazyGeek đã mô tả, tạo ra một mô-đun mới, chứa tất cả các loại hằng số khác nhau, và tiêm nó vào mỗi mô-đun cần nó – CodyBugstein

0

tôi sử dụng yêu cầu đánh chặn cho

này
csapp.factory('MyHttpInterceptor', [function() { 

     var requestInterceptor = function (config) { 

      var prefix = "http://api.example.com"; 

      if (config.url.indexOf("/api/") !== -1) { 
       config.url = prefix + config.url; 
      } 
     } 
}]); 

configure đánh chặn này trong app.config như

csapp.config(["$httpProvider", function($httpProvider) { 
     $httpProvider.interceptors.push('MyHttpInterceptor'); 
}); 

bây giờ tất cả các yêu cầu api của bạn sẽ được bắt đầu bằng api.example.com.

+0

mà bộ chặn này được thêm vào '$ httpProvider' ở đâu? – CodyBugstein

+1

được cập nhật theo nhận xét – harishr

0

$ location.host() là 'tiền tố.domain.suffix' của trình duyệt của khách hàng ' Bạn có thể tiêm $ location vào bất kỳ phạm vi hoặc dịch vụ nào.

angular.module('app',[]).run(function($rootScope, $location){ 
    $rootScope.host = $location.host(); 
}) 

Plunk:. http://plnkr.co/edit/gDgrlwZFyWNKUJgbHHKj?p=preview

<!DOCTYPE html> 
 
<html ng-app="app"> 
 
    <head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.7/angular.js"></script> 
 
    </head> 
 
    <body> 
 
    <i>Host:</i> 
 
    <h1>{{host}}</h1> 
 
    <script> 
 
     angular.module('app',[]).run(function($rootScope, $location){ 
 
     $rootScope.host = $location.host(); 
 
     }); 
 
    </script> 
 
    </body> 
 
</html>

+1

CrazyGeek trả lời câu hỏi của bạn chính xác hơn, tôi chỉ tiết kiệm cho bạn bước cần thay đổi máy chủ theo cách thủ công. – irth

+0

THanks cho tip mát mẻ. Tôi sẽ không sử dụng giải pháp này chính xác nhưng tốt để biết về – CodyBugstein

Các vấn đề liên quan