0

I have added different marker on open street map. And when I tried to add link to open new page I am not getting any response.

const marker = Leaflet.marker([lat, lon], { icon }).bindPopup(`<a [routerLink]="['/jobs/view-job', jobMarker.id]" class="mr-2" >`+ jobMarker.hospital_trust +`</a>`);

I have added foreach to show all the marker so I am getting id one by one.

for (const jobMarker of res.data) {
        if(jobMarker.latitude && jobMarker.longitude) {
          const lat = jobMarker.latitude;
          const lon = jobMarker.longitude;
          const marker = Leaflet.marker([lat, lon], { icon }).bindPopup(`<a [routerLink]="['/jobs/view-job', jobMarker.id]" class="mr-2" >`+ jobMarker.hospital_trust +`</a>`);
          
          marker.addTo(map);
        }

      }

How I can add link to marker in angular.

  • I believe you will either need to dynamically create a component and pass in its native html of it, or you just have to use an href instead of [routerLink]. What you are doing you are just writing plain html in that bindPopup, as such [routerLink] means nothing to HTML. Angular converts that to something of value when it builds components, but this flow bypasses it – SomeStudent Oct 17 '22 at 13:49

0 Answers0