AngularJS - Nhận dữ liệu theo số

Question

trước hết, chúc mừng năm mới.
Nhưng công việc phải tiếp tục! ;)

Tôi nhận được tình huống sau:
Tôi nhận được một số dấu tùy chỉnh là bản đồ tĩnh (không phải google). Tôi hiển thị (và lọc) các điểm đánh dấu với mã này:

<div ng-controller="DealerDetailsListCtrl"> 
    <a ng-click="showdetails=!showdetails" href="#/dealer/{{marker.id}}" class="marker" style="left:{{marker.left}};top:{{marker.top}}" ng-repeat="marker in dealer|zipFilter:zipCodeLookup:countryLookup"></a> 
</div> 

tôi lộ nó vào "đại lý-details.html" nơi tôi hiển thị thành công ID:

<div class="alldealermodal" ng-controller="DealerDetailsCtrl">  
    <div ng-view></div> 
    </div> 

với bộ điều khiển này/định tuyến :

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
     when('/dealer/:id', {templateUrl: 'files/tpl/dealer-details.html', controller: DealerDetailsCtrl}). 
     otherwise({redirectTo: '/'}); 
}]); 

và

function DealerDetailsCtrl($scope, $routeParams) { 
    $scope.id = $routeParams.id; 
} 

Vì tôi rất mới với angularJS tôi muốn biết, làm thế nào tôi có thể nhận được tất cả các dữ liệu của ID.

tệp json của tôi trông như thế này:

[ 
{ 
    "id": "2", 

    "name": "Laden Dortmund", 
    "strasse": "Unionstr.", 
    "hausnr": 1, 
    "plz": "45525", 
    "stadt": "Dortmund", 
    "land": "DE", 
    "url": "http://www.google.de", 
    "tel": "0234-234568", 
    "email": "lade@indortmund.de", 
    "left": "200px", 
    "top": "300px", 
    "lowRange":60000, 
    "highRange":70000 
}, 
{ 
    "id": "1", 
    "name": "Laden Unna", 
    "strasse": "Berlinerstr.", 
    "hausnr": 134, 
    "plz": "78654", 
    "stadt": "Unna", 
    "land": "AT", 
    "url": "http://www.bing.de", 
    "tel": "0234-11223344", 
    "email": "lade@inunna.de", 
    "left": "250px", 
    "top": "500px", 
    "lowRange":40000, 
    "highRange":50000 
} 
] 

và vân vân .... và tôi muốn để có được tất cả các dữ liệu từ id chọn. Làm thế nào tôi có thể làm điều đó? Ai đó sẽ cho ma một gợi ý?

tôi sử dụng điều khiển này để có được tất cả các dữ liệu từ các json:

function DealerListCtrl($scope, $http) { 
    $scope.dealer = []; 
    $http.get('files/js/dealer.json').success(function(data) { 
    $scope.dealerall = data; 
    }); 
    $scope.orderProp = 'id'; 
} 

Cảm ơn bạn rất nhiều!

Answer 1

Trước hết, bạn không cần đặt ng-controller="DealerDetailsCtrl" trong dealer-details.html, vì ng-view sẽ xử lý điều đó.

Thứ hai, bạn nên cung cấp một service để lấy dữ liệu của bạn:

var app = angular.module('myApp', []); 

app.factory('dealerService', function($http) { 
    return { 
     getDealerList function() { 
     var dealers = { 
      list : [] 
     }; 
     // TODO add possible caching via $cacheFactory 
     $http.get('files/js/dealer.json').success(function(data) { 
      dealers.list = data; 
     }); 
     return dealers; 
     }, 

     // other functions 
    }; 

}); 

Trong điều khiển của bạn, nơi bạn cần phải truy cập vào các đại lý của bạn, chỉ cần tiêm DealerService, như bạn sẽ một dịch vụ khác. Để tìm nạp một mục cụ thể, chỉ cần lặp lại.

Một khả năng khác là sử dụng thuộc tính resolve trên $routeProvider để gửi dữ liệu đại lý đến DetailController.