ForgeComponents
el

Components

j-DynamicValue

jComponent 20 · jcomponent@20 component Παράδειγμα φορτωμένο με jComponent 20

Αυτό το συστατικό είναι ένα πολύ ειδικό στοιχείο. Μπορεί να διατηρήσει μια τιμή για παράδειγμα Number και στο ίδιο μπορεί να κάνει ένα άλλο αναγνώσιμο text.


  • icon {String} εικονίδιο για την ετικέτα, π.χ. σπίτι, cog, κλπ.
  • Ετικέτα label {String} (προεπιλεγμένο είναι το περιεχόμενο HTML)
  • Το εικονίδιο icon2 {String} στο δεξί πλαίσιο, για παράδειγμα, σπίτι, κ.λπ. (προεπιλεγμένο: angle-down)
  • Το placeholder {String} προσθέτει κείμενο
  • Το disabled {Boolean} απενεργοποιεί αυτό το συστατικό
  • find {String} important σύνδεση με το function(el, next(value)) για να δεσμεύσετε μια νέα τιμή
  • read {String} σύνδεση με το function(value, next(response)) για να δεσμεύσετε ένα αναγνωρίσιμο text
  • Το url {String} προσπαθεί να συνδέσει μια τιμή μέσω του AJAX(), το επιχείρημα {0} στην URL αντικαθίσταται από την τιμή
  • html {String} Tangular πρότυπο για την αναπαραγωγή μιας αξίας (προεπιλεγμένη: {{ name }})
  • remap {String} Η λειτουργία αναβάθμισης (default) nullΓια παράδειγμα: value.length ? value[0] : null
  • Το required {Boolean} επιτρέπει το «αναγκαίο» (προεπιλεγμένο: false)
  • bind {String} ένα μονοπάτι προς τη μέθοδο ή την μεταβλητή όπου θα δεσμευτεί η φορτισμένη αξία (επιλεγμένη)
  • dirsource {String} μια σύνδεση με τη μέθοδο function(search, next(items_arr)) ή NEW: μπορεί να περιέχει URL για την αναζήτηση σε μορφή GET /api/partners/?q={0}
  • Το dircustom {String/Boolean} μπορεί να περιέχει ένα μονοπάτι προς τη λειτουργία(val, next(new_val)) ή μπορεί να είναι Boolean. Αυτή η επιλογή μπορεί να επιτρέπει την προσθήκη μιας προσαρμοσμένης αξίας (αξία που δεν ορίζεται στην πηγή δεδομένων)
  • dirrender {String} ένα μονοπάτι προς function(item, text) (πρέπει να επιστρέψει το HTML για j-Directory), αυτή η λειτουργία μπορεί να επηρεάσει τη λίστα των στοιχείων στο j-Directory
  • dirminwidth {Number} ελάχιστη πλάτος για j-Directory, (προεπιλεγμένη: 200)
  • dirmaxwidth {Number} Μέγιστο εύρος για j-Directory
  • dirplaceholder {String} για το j-Directory
  • Το dirempty {String} προσθέτει ένα κενό πεδίο για το j-Directory
  • dirkey {String} ένα όνομα κλειδί για την ανάγνωση του κειμένου σε απευθείας πηγή (προεπιλεγμένο: name)
  • dirvalue {String} ένα όνομα κλειδί για την ανάγνωση της αξίας στην πηγή (προεπιλογή: id)
  • onresponse {String} ένα μονοπάτι στην ιδιοκτησία ή function(response), εκτελεσμένο εάν η απάντηση είναι επεξεργασμένη (προεπιλογή: undefined)
  • NEW tapi {Boolean} επιτρέπει την κλήση TAPI() insteadof AJAX() (προεπιλεγμένη: ψεύτικη)

Χρησιμοποιήστε το Ajax

Εάν το value αλλάξει, τότε το στοιχείο εκτελεί αυτόματα την κλήση AJAX.

<ui-component name="dynamicvalue" path="path.to.property" config="url:/users/{0}/;dirsource:GET /users/?search={0}"></ui-component>

Εσωτερική χρήση

Εάν το value αλλάξει, τότε το συστατικό εκτελεί το config.exec για να πάρει ένα αναγνωρίσιμο κείμενο μιας αξίας.

<ui-component name="dynamicvalue" path="path.to.property" config="exec:my_function"></ui-component>

<script>
	function my_function(value, next) {
		next({ name: 'This text will be displayed as a value '});
	}
</script>

Καλό να ξέρεις:

  • Το component.response περιέχει μια πρώιμη αντίδραση από το αποτέλεσμα

Χρησιμοποιήστε το με <ui-component name="dynamicvalue">Όταν το στοιχείο δεν έχει φορτωθεί ακόμα, jComponent Κατεβάστε το για πρώτη φορά από τη διεύθυνση DEF.fallback (Η Componentator Συγγραφέας: Peter Širka. πηγή: το Componentator Ετικέτες Αξιολόγηση, MIT άδεια.

example.html
<div style="width:300px">
	<ui-component name="dynamicvalue" path="userid" config="exec:getuser;click:finduser;placeholder:Choose a user">User</ui-component>
</div>

<script>
	var userid = 1;

	function getuser(value, next) {
		// Here you can read a readable text
		// Value is binded according to the "config.html" Tangular template
		next({ name: 'Peter' });
	}

	function finduser(element, next, current_value) {
		// "next" must received a new value which will be binded from e.g. j-Suggestion or some j-Form
		// a value will be automatically binded according to the component "path"
		next(1);
	}

</script>