Angular url 매개 변수를 기반으로 html 파일을 선택하십시오.

Question

저는 각도에 대해 잘 모릅니다. URL 라우팅 및 상태 등을 사용하는 것과 관련하여 모범 사례를 찾으려고합니다. 시나리오가 있어요. 간단한 질문이지만 사용할 수있는 것을 처리하는 데 사용하고 있습니다.

포드 자동차와 도요타 자동차에 대한 정보를 표시하기 위해 두 개의 완전히 다른 웹 페이지가 있다고 가정 해보십시오. 페이지에 액세스 할 때 보유하고있는 것은 ID 번호 뿐이므로 "cars.com/info/id:198273918273"이라는 URL을 누르십시오. 가장 좋은 방법은 angular.js를 사용하여 URL에서 ID 번호를 즉시 제거하고 브라우저를 사용하여 브라우저의 상단에 표시된 URL을 변경하지 않고 해당 자동차 페이지를 표시하고 적절한 html 페이지를 표시하는 것입니다.

Answer 1

당신이

.when('/your_url/:car_id', { 
    templateUrl: function(attrs){ 
     //Example of the login yours will be complex i guess :P 
     if(attrs.car_id == 1) { return 'template_ford.html' } 
     if(attrs.car_id == 2) { return 'template_toyota.html' } 
    }, 
    controller : 'someController' 
}) 

그하여 경로 templateUrl에서 기능을 사용할 수 있습니다

에 대한 좋은 초심자 튜토리얼입니다 페이지가 렌더링되기 전에 템플릿이 변경 될 수 있으므로 사용자를 다른 URL로 보낼 필요가 없습니다.

Answer 2

당신이 여기에 각-UI 라우터

$stateProvider 
.state('car-get', { 
    url:'/info/{car_id}/', 
    controller: ['$scope','$stateParams',function($scope,$stateParams){ 
     var car_id = $stateParams.car_id; 
     // now you can get your car info 
     // and bind it to your template. 
     $scope.car = myservice.getcarinfo(car_id) //Here goes your service or your api calls to get car info 
    }], 
    templateUrl: 'path_to_detail_car_page.html', 
}); 

를 사용하고 있다고 가정하면 Angular-ui Router