ForgeComponenten
nl

Componenten

j-Importer

jComponent 20 · jcomponent@20 component Voorbeeld geladen met jComponent 20

j-Import is een geweldige component voor het importeren van HTML-templaten, scripts of stijlen volgens de route en de omstandigheden.De component kan helpen met SPA-toepassingen omdat u eenvoudig templates, scrips of stijl dynamisch kunt importeren.


Configuratie:

  • if {String} moet een waarde bevatten
  • url {String} relatieve/absolute URL naar een subpagina of subpart
  • reload {String} is een link naar de methode in het wereldwijde bereik, het wordt uitgevoerd als de condition geldig is
  • cleaner {Number} (optional) idle tijd (in minuten) voor het uitvoeren van de reiniging (default: 0)
  • clean {String} (optional) een link naar de functie, het wordt uitgevoerd voordat de importeur wordt gereinigd
  • id {String} is een aangepaste identificator voor het vervangen van ~ID~ zintuigen in de geïmporteerde HTML (default: leeg)
  • NEW: singleton {Boolean} het behandelt alleen de ene instantie van de invoerer volgens de path + if + url (default: false)
  • NEW: parent {String} beweegt zichzelf als een direct kind van de parent selector
  • NEW: adapt {Boolean} als true het de reload:?/soemthing methode noemt voor de nested plugin in plaats van de huidige plugin (default: false)

Nieuwe update:

j-Importer kan <script type="text/html"> bevatten met een inhoud dat als HTML zal worden beoordeeld als de voorwaarde geldig is.

Goed om te weten 1:

  • Alle CLASS en ~PATH~ De woorden worden vervangen door config.path Of config.if Automatisch
  • Alle ~ID~-afdrukken worden automatisch vervangen door config.id
  • De importeur vervangt automatisch <SCR>-elementen voor <script> elementen alleen binnen de <script type="text/html">-template.

Goed om te weten 2:

Als de component niet binnen het bereik ligt, dan vervangt de waarde van de config.if de ? tekens in alle configuratieschijven.

Gebruik het met <ui-component name="importer">Wanneer de component nog niet is geladen, jComponent Download het op eerste gebruik van het adres in DEF.fallback (De Componentator Schrijver: Peter Širka. bron: de Componentator Componenten repository, MIT licentie.

example.html
<div>CURRENT VALUE: <ui-bind path="myvalue" config="html:value"></ui-bind></div>
<ui-component name="importer" path="myvalue" config="if:d3;url:https://d3js.org/d3.v4.min.js"></ui-component>

<script>

	var myvalue = '';

	setTimeout(function() {
		SET('myvalue', 'd3');
	}, 3000);

	setTimeout(function() {
		SET('myvalue', null);
	}, 5000);

	setTimeout(function() {
		// The component contains prevention for double import, so D3 won't be imported again.
		SET('myvalue', 'd3');
	}, 8000);

</script>