समस्या

एम्बर-लीफलेट एम्बरजेएस इकोसिस्टम का एक बहुत लोकप्रिय ऐडऑन है जो बहुत अधिक लचीलेपन की अनुमति देता है।

लेकिन क्या होगा यदि मैं इसकी कार्यक्षमता को बढ़ाना चाहूं ताकि यह और भी अधिक कार्य कर सके? और क्या होगा यदि मैं इसे सीधे s परतों से एक नए प्राप्त घटक के रूप में चाहता हूँ?

समाधान

सबसे पहले हमें अपने नए घटक की आवश्यकता होगी। सरलता के लिए यह घटक ऐडऑन से मौजूदा परत घटक का विस्तार करेगा। आइए मार्कर घटक का उपयोग करें और इसे ऐसा बनाएं कि यह स्थान तर्क को अनदेखा कर दे और एक नकली, हार्डकोडेड मान सेट कर दे:

// app/components/fake-marker-layer.gts

import MarkerLayer from 'ember-leaflet/components/marker-layer';

export default class FakeMarkerLayer extends MarkerLayer {
  get location() {
    return this.L.latLng(46.68, 7.85);
  }
}

इसके बाद हमें घटक को एम्बर-लीफलेट सेवा के साथ पंजीकृत करना होगा:

// app/instance-initializers/leaflet.ts

import FakeMarkerLayer from '../components/fake-marker-layer';
import type Owner from '@ember/owner';

export function initialize(owner: Owner) {
  const emberLeafletService = owner.lookup('service:ember-leaflet');

  if (emberLeafletService) {
    emberLeafletService.registerComponent('fake-marker-layer', {
      as: 'fake-marker',
      component: FakeMarkerLayer,
    });
  }
}

export default {
  initialize,
};

और अब हम इसका उपयोग कर सकते हैं:

import LeafletMap from 'ember-leaflet/components/leaflet-map';

टिप्पणियाँ

आप इस तकनीक के बारे में आधिकारिक एम्बर-लीफलेट दस्तावेज़ीकरण पृष्ठ पर भी पढ़ सकते हैं।