0

郵便番号に基づいて静的な(グーグル以外の)地図にマーカーを設定しようとしています。
これは私のhtmlコードです:

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

次に、郵便番号と国でフィルタリングされたすべてのマーカーを表示しようとします。ドロップダウンは次のとおりです。

<input type="text" name="plz" placeholder="PLZ (z.B 80469)" class="plz" ng-model="zipCodeLookup">
<select name="drop" tabindex="1" class="drop" id="dropcountry" ng-model="countryLookup" ng-options='option.value as option.name for option in typeOptions'>
</select>

私は次のフィルターを手に入れました:

app.filter("zipFilter", function() { return function(markers, country, zip) {
    var retMarkers = [];
    for(var i = 0, len = markers.length; i < len; ++i) {
        var singleMarker = markers[i];
        if(singleMarker.land == country) {
            retMarkers.push(singleMarker);
        }
    }
    return retMarkers;
}});

主な問題は次
のとおりです。ユーザーの郵便番号から20(km /マイル)以内のすべての郵便番号を取得する外接円検索を取得しました。これは正常に機能しています。(コントローラー内ではなく)フレームワークに直接アクセスすると、次のようなjsonが表示されます。

{"plz":["44787","44789","44791","44793","44795","44797","44799","44801","44803","44805","44807","44809","44866","44867","44869","44879","44892","44894","45525","45527","45529","45549"]}  

郵便番号「45525」の場合。

次に、この郵便番号の配列内にあるすべてのマーカー(ディーラー)を表示する必要があります。
エリアのzipjsonを取得するには、フィルター内のzipパラメーターとcountryパラメーターを「areasearch」関数「files / framework / umkreis /:zip /:country」に送信する必要があります。
その後、いくつかのマーカーがこのjsonにあるかどうかを確認し、それらをフィルター処理する必要があります。

このようなものをフィルターに組み込む方法がわかりません。それについて私を助けてくれませんか?どうもありがとうございます。

その他の役立つ情報:
ルートとサービス:

app.factory('dealerService', ['$resource', '$http', '$rootScope', function($resource, $http, $rootScope){
    return {
    //the resource provider interacting with the PHP backend
        api: 
        $resource('files/framework/dealer/:id', {}, {
            update: {method:'PUT'}
        }),
    }
}])

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

エリアの郵便番号を取得するための「スリム」フレームワークへのルートは次のとおりです。

files/framework/umkreis/45525/DE
or
files/framework/umkreis/:zip/:country
4

1 に答える 1

2

フォームの「zipCodeLookup」と「countryLookup」の2つのフィールドに基づいて、地図上のマーカーを更新しようとしているようです。

<input ... ng-model="zipCodeLookup" ... />
<select ... ng-model="countryLookup" ... ></select>

マーカーは次のコントローラーに表示されます。

<div ng-controller="DealerMarkerListCtrl"></div>  

そして、このルートを使用して、PHPサーバーからJSONを収集しています

files/framework/umkreis/:zip/:country

必要なのは、「DealerMarkerListCtrl」コントローラーで郵便番号と国を取得する関数を指定し、サーバーからの新しいJSONを使用してディーラーを更新することです。

$scope.updateDealer = function(zip, country) { 
    $http.get('files/framework/umkreis/'+ zip + '/' + country).
    success(function(data) { 
        $scope.dealer = data; 
    }); 
}

これを取得したら、この関数を呼び出す入力を含むにng-submitを追加できます。<form>

<form ng-submit="updateDealer(zipCodeLookup, countryLookup)"> ... </form>

<form>新しく作成された関数を表示するには、が正しいコントローラーの内部にあることを確認してください。ユーザーがこのフォームを送信するたびに、PHPサーバーが呼び出され、JSONが取得され、ディーラー配列が更新されます。

于 2013-01-04T20:04:14.490 に答える