傳單彈出窗口第二次不起作用

Question

我用 for 循環在地圖上創建了標記。 單擊時，標記彈出窗口正在打開。 第二次單擊后，標記彈出窗口未打開。 $scope.resSearchAnnouncement有 JSON 數據。 我怎么解決這個問題？

var ngApp = angular.module('test', ['']);
window.ngApp.controller('controllerHome', ['$scope', '$controller', '$location',
function ($scope, $controller, $location) {
        $scope.map = L.map('map', {
            zoomControl: true,
            maxZoom: 18,
            minZoom: 0
        }).setView([$scope.lat, $scope.lng], 13);
        $scope.map.zoomControl.setPosition('bottomright');
        L.tileLayer('https://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}', {
            subdomains: ['mt0', 'mt1', 'mt2', 'mt3']
        }).addTo($scope.map);
        $scope.marker = L.marker($scope.map.getCenter(), {
            draggable: true,
            icon: L.icon({
                iconUrl: '/assets/img/pin-4ldpi.png',
                iconSize: [30, 35],
                iconAnchor: [30 / 2, 35],
            })
        }).addTo($scope.map);
  for (var i = 0; i < $scope.resSearchAnnouncement.length; i++) {
        var icon = "";
        announcementMarker.id = $scope.resSearchAnnouncement[i].id;
        announcementMarker.annoInfo = $scope.resSearchAnnouncement[i];
        announcementMarker.on('click', function () {
            if (this._popup == undefined) {                                     
                content = '<div class="d-block color1-lighten-15 p-2"><span class="mb-2 d-block">' +
                    '<span class="mb-2 d-block color2-lighten-3 p-2"><strong>' + this.annoInfo.status + ' ' + this.annoInfo.category + ' / ' + this.annoInfo.subcategory + ' </strong></span>' +                        
                    '<span class="d-block pl-2"><strong>Tarih </strong>: ' + $scope.dateFormatter(this.annoInfo.anndate) + ' </span>'
                '</div>';
                this.bindPopup(content).openPopup();
            } else {
                this.openPopup();
            }
        });
        $scope.markerClusters.addLayer(announcementMarker);
    }
}]);

Answer 1

var marker = L.marker([51.505, -0.09], {});
marker.addTo(map);
marker.bindPopup('popup content');

marker.on('click', function () {
    if (!this._popup) { // when maker dont have pop up, this will bind popup and and open it
        this.bindPopup('Popup content').openPopup();
    }
});

我已經為您創建了此示例，請檢查它希望它會幫助您！

Answer 2

Popup 有一個onClose屬性，你應該聲明如下（在此之前我個人使用useState鈎子作為 Marker 標簽的onClick屬性）

onClose={() => {
  setXxx(null);
}}