1

いくつかのマーカーが付いた地図があります。クリックすると、各マーカーがオーバーレイ div を開きます。 

 <div class="map" ng-init="loadall()">
            <a ng-click="details.show=!details.show" href="#/dealer/{{marker.id}}" class="marker" style="left:{{marker.coordleft}}px;top:{{marker.coordtop}}px" ng-repeat="marker in dealer"></a>    
        </div>

このdivを開いています： 

<div ng-show="details.show">      
    <div ng-view></div>
</div>

問題:
div が既に開いている場合 (details.show == true)、顧客は、div を開いたままにしてマップ上の別のマーカーをクリックすると、div が再び閉じることに気付きました。

私が達成したいこと:
div が既に開いている場合は、div を閉じて再度開くことなく、新しいコンテンツを ng-view にロードするだけです。

これは可能ですか？

編集：

私のルート: 

app.config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/dealer/:id', {templateUrl: 'files/tpl/dealer-details.html?20', controller: 'DealerDetailsCtrl', activetab: 'details'}).
      when('/dealermessage/:id', {templateUrl: 'files/tpl/dealer-message.html?124', controller: 'DealerMessageCtrl', activetab: 'message'}).
      when('/dealersendmessage/:id', {templateUrl: 'files/tpl/dealer-details.html?8', controller: 'DealerDetailsCtrl', activetab: 'details'}).
      otherwise({redirectTo: '/dealer'});
}]);

マーカーがクリックされた場合、最初のルートとコントローラーが読み込まれます。これは役に立ちますか?

編集番号2:
「マーカー/divトグルは現在機能していますが、開いたオーバーレイの奇妙な動作が発生しました。

例:
"Marker 1" を開くと、div が正常に開きます。「マーカー 1」の div が開いているときに、「マーカー 2」をクリックすると、「マーカー 2」のコンテンツで div が更新されます。しかし、「マーカー1」をクリックすると、divが突然閉じます。
どうすればそれを止めることができますか?

4

3 に答える 3

3

まだよくわかりませんが、モデルを 1 つだけ保持して複数のマーカーを切り替えます。したがって、あるマーカーをクリックして開くと、マーカーの状態を保持しないため、別のマーカーがそのマーカーを閉じます。おそらく次のようなものが必要です。

<div ng-repeat="marker in dealer">
   <a ng-click="details.show=toggle(marker)" href="#/dealer/{{marker.id}}" 
      class="marker" style="left:{{marker.coordleft}}px;top:{{marker.coordtop}}px"></a>
</div>

コントローラーでtoggle関数を定義します。

$scope.toggle = function(marker) {
   marker.show = !marker.show;

   return marker.show;
};
于 2013-01-14T17:46:58.287 に答える
1

ng-click ハンドラーには、より多くのロジックが必要です (@asgoth の回答が示すように)。

別の可能な解決策 (ディーラー データを変更しない): $eventng-click ハンドラーに渡す

<a ng-click="handleOverlay($event)" ... ></a>

次に、srcElement を $scope ( $scope.openMarker = ev.srcElement) に格納します。その後、handleOverlay() は、クリックごとに、クリックが既に開いている要素で発生しているか、新しい要素で発生しているかを判断できます。

ng-view をどのようにリロードしているかはわかりません。そのため、それが問題である場合は、さらにコードを確認する必要があります。たとえば、新しいビューごとに異なるコントローラーをロードしていますか? その場合、srcElement をサービスまたは rootScope (つまり、ビュー/コントローラーの変更後も存続するもの) に格納する必要がある場合があります。

于 2013-01-14T17:55:52.173 に答える
0

そこで、asgoth のソリューションに従い、それを拡張して Marek123 が言及した問題を修正しました。以下は私の解決策です：

$scope.selectedMarker = {};
$scope.toggle = function(marker) {
  //assuming you have a key "id" in each dealer
  if (marker.id !== $scope.selectedMarker.id) {
      _.each($scope.delear, function(value, index) {
        $scope.delear[index].show = false;
      });
    }
   marker.show = !marker.show;
   return marker.show;
};
于 2013-03-05T08:47:10.397 に答える