如何在角度$ http中傳遞URL參數

我正在將服務器端CRUD應用程序轉換爲Angular.js，並且存在一個小問題。

我收到我的數據$http並通過ng-repeat顯示所有數據。我想讓用戶能夠點擊並指定一個項目並將其重定向到資源。

那麼如何將URL參數傳遞給$http動態獲取調用？

下面是如何建立的鏈接資源（car.id = 3）

<a ng-href="/#/cars/{{car.id}}">Edit</a>

鏈接應該去http://local.dev/#/cars/3

那麼，如何綁定在我的控制器的動態網址？

這裏是我的控制器的一個精簡版

App.controller('CarIndexCtrl', ['$scope', '$http', '$location', function ($scope, $http, $location) { 

    $scope.car = {}; 

    $http({ 
    method: 'GET', 
    url: $location.$$url, 
    }) 
    .success(function (data, status, headers, config) { 
    $scope.car = data; 
    }) 
    .error(function (data, status, headers, config) { 
    // error 
    }); 

}]);

所以我很感興趣的URL角的方式進行綁定。上述解決方案有效，但感覺非常像黑客。我對Angular不太熟悉，所以我現在喜歡默認。儘管如此，我可能會考慮在稍後時間使用緩衝或ng資源...

來源

2013-10-15 stormpat

上述解決方案的工作原理，但感覺非常像黑客。

我不認爲它的黑客或東西混亂。

我會在控制器中生成URL列表（從我的觀點來看，它更適合代碼維護），而無需附加在HTML中。喜歡的東西：

$scope.urlList = []; 

    $http({ 
    method: 'GET', 
    url: $location.$url, 
    }) 
    .success(function (data, status, headers, config) { 
    $scope.car = data; 
    $scope.urlList.push("/#/cars/" + data.id); 
    }) 
    .error(function (data, status, headers, config) { 
    // error 
    });

在HTML後：

<li ng-repeat="url in urlList" repeat-done="layoutDone()" ng-cloak> 
    <a ng-href="{{url}}">Edit</a> 
</li>

順便說一句，我建議你使用一些裝載機，因爲URL鏈接，我們從承諾（又名異步），因此產生與延遲。

演示Fiddle

來源

2013-10-15 11:30:26

與urlList的好處，我會盡力實現這一點。 – stormpat

在你app.js做這樣的事情

var app = angular.module('YourAPP'); 
     app.config(function ($routeProvider) { 
      $routeProvider 
       .when('/cars/:CarID', { 
        templateUrl: 'app/views/cars.html', 
        controller: 'CarIndexCtrl' 
       }); 
    });

而在你的控制器

App.controller('CarIndexCtrl', ['$scope', '$http', '$location', '$routeParams', function ($scope, $http, $location, $routeParams) { 

     $scope.car = {}; 
     $scope.carid = $routeParams.CarID; 
     $http({ 
     method: 'GET', 
     url: $location.$$url, 
     }) 
     .success(function (data, status, headers, config) { 
     $scope.car = data; 
     }) 
     .error(function (data, status, headers, config) { 
     // error 
     }); 

}]);

和使用的任何地方carid在您的控制器。希望能幫助到你。

來源

2013-10-15 11:50:19 BKM

謝謝我會嘗試你的建議！所以url：$ location。$$ url，方法是正常使用的東西。我不知何故認爲有一種綁定網址的替代方法。 – stormpat

如何在角度$ http中傳遞URL參數

回答

相關問題