Javascript AngularJS-点击并显示ng

我有一张上面有记号的地图。单击后，每个标记将打开一个叠加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>  

如果已单击标记，则第一条路由和控制器正在加载。这是否有帮助

第2号编辑： marker/div切换现在正在工作，但我现在看到了打开的覆盖的一个奇怪行为

例如： 当我打开Marker 1时，div的打开状态良好。当Marker 1的div打开时，我可以单击Marker 2，div将刷新Marker 2的内容。但当我现在点击标记1时，div突然关闭。

---

我怎样才能阻止它

仍然不太理解，但您只保留一个模型来切换多个标记。因此，如果您单击一个标记以打开，另一个标记将关闭它，因为您不保留标记的状态。您可能需要以下内容：

<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>

---

仍然不太了解它，但您只保留一个模型来切换多个标记。因此，如果您单击一个标记以打开，另一个标记将关闭它，因为您不保留标记的状态。您可能需要以下内容：

<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>

---

正如@asgoth的回答所示，您的ng click处理程序需要有更多的逻辑

另一种不修改经销商数据的可能解决方案：将$event传递到ng click处理程序中

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

然后将srcement存储在$scope$scope.openMarker=ev.srcement上。然后，handleOverlay可以为每次单击确定单击是发生在已打开的图元上，还是新的图元上

---

我们不知道如何重新加载ng视图，所以如果这是一个问题，我们需要查看更多代码。例如，是否为每个新视图加载不同的控制器？如果是这样的话，您可能需要将src元素存储在服务或根范围上，即在视图/控制器更改后仍能生存的东西。

您的ng click处理程序需要有更多的逻辑，如@asgoth的回答所示

另一种不修改经销商数据的可能解决方案：将$event传递到ng click处理程序中

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

然后将srcement存储在$scope$scope.openMarker=ev.srcement上。然后，handleOverlay可以为每次单击确定单击是发生在已打开的图元上，还是新的图元上

---

我们不知道如何重新加载ng视图，所以如果这是一个问题，我们需要查看更多代码。例如，是否为每个新视图加载不同的控制器？如果是这样的话，您可能需要将src元素存储在服务或根范围上，即在视图/控制器更改后仍能生存的东西。

因此我遵循了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;
};

---

因此，我遵循了阿斯哥特的解决方案，并对其进行了扩展，以解决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;
};

---

我不明白这里有什么。是ng click=details.show=！详细信息。显示切换链接吗？我不明白这里有什么。是ng click=details.show=！详细信息。显示切换链接？切换不是问题所在。它很好用。但我的客户希望，如果覆盖是open show==true，并且客户单击下一个标记，则内容将使用新id重新加载，而不是关闭覆盖。@Marek123好吧，我同意切换可能正确切换一个标记，但您试图让ng click做的不仅仅是现在切换，对吗？如果你尝试了阿斯哥特的建议，成功了吗？如果它不起作用，会发生什么？是的，我尝试了阿斯哥特的解决方案，效果非常好。非常感谢。我可以问一些离题的问题吗。可以确定单击了哪个标记并用ng类标记此标记吗？marker.show应该指示单击了哪个标记，所以只需添加一个使用它的ng类指令：ng class={someClassYouHave:marker.show}我得到以下错误：错误：语法错误：标记“undefined”不是表达式[{active\u marker:]的NaN列的主表达式，从[{active\u marker:]开始。错误时，切换不是问题。它可以正常工作。但我的客户希望，如果覆盖是打开的show==true，并且客户单击了下一个标记，则内容应使用新id重新加载，而不是关闭覆盖。@Marek123好吧，我同意切换可能会正确切换一个标记，但您正在尝试获取y我们的ng click不仅仅是现在切换，对吗？如果你尝试了asgoth建议的方法，它有效吗？如果无效，会发生什么？是的，我尝试了asgoth的解决方案，效果非常好。谢谢。我可以问一些离题的问题。是否可以确定，哪个标记被单击，并用ng类标记此标记？marker.show should表示单击了哪个标记，所以只需添加一个使用它的ng类指令：ng class={someClassYouHave:marker.show}我得到以下错误：错误：语法错误：标记“undefined”不是表达式[{active\u marker:]的NaN列的主表达式，从[{active\u marker:]开始。错误时，我将路由添加到了我的初始帖子中，这对您有帮助吗？每次单击都可能通过添加控制台创建一个新的控制器。l

---

og'in ctrl'作为DealDetailsCtrl的第一行。因此，您需要将与当前打开的覆盖相关的src元素存储在$rootScope或服务中，或者尝试@asgoth建议的方法。将$rootScope注入您的DealerDetailsCtrl以获得对它的访问权：函数DealerDetailsCtrl$scope，$rootScope{…}它现在可以工作了。但是我仍然有一些错误，请检查我的编辑。现在我看了更多，我不认为asgoth的答案会起作用，因为它为每个标记设置了一个切换，因此你看到的行为。我认为您应该尝试我的方法-将当前打开的标记或元素保存在$rootScope或服务中。让单击处理程序确定当前单击是否与上次单击的标记关联，并相应地采取行动。如果您仍然有问题，请设置一个fiddle或plunkr。我将路由添加到了我的初始帖子中，这对您有帮助吗？每次单击都可能通过添加控制台创建一个新的控制器verify。登录ctrl作为DealerDetailsCtrl的第一行。因此，您需要将与当前打开的覆盖相关的src元素存储在$rootScope或服务中，或者尝试@asgoth建议的方法。将$rootScope注入您的DealerDetailsCtrl以获得对它的访问权：函数DealerDetailsCtrl$scope，$rootScope{…}它现在可以工作了。但是我仍然有一些错误，请检查我的编辑。现在我看了更多，我不认为asgoth的答案会起作用，因为它为每个标记设置了一个切换，因此你看到的行为。我认为您应该尝试我的方法-将当前打开的标记或元素保存在$rootScope或服务中。让单击处理程序确定当前单击是否与上次单击的标记关联，并相应地采取行动。如果您仍然有问题，请设置小提琴或弹琴。