Layer-Daten, die von der ArcGIS REST API zurückgegeben werden<\/A>. Diese sagen dir, welche Felder verfügbar sind, welche bearbeitbar sind und welchen Feldtyp sie haben – das ist wirklich mächtige Information für die Bearbeitung. Du kannst diese Informationen nutzen, um deine Bearbeitungsformulare für deine Anwendung dynamisch zu erstellen.<\/P><\/P>
Wir vereinfachen dieses Szenario etwas.<\/EM><\/P><\/P>Nehmen wir einfach an, du möchtest Folgendes tun:<\/P>Eingabefelder für jedes Attributfeld anzeigen<\/LI>Änderungen in der Eingabe an die Attribute binden<\/LI>Diese Änderungen anzeigen<\/LI><\/UL><\/P>Accessors ermöglichen uns genau das.<\/STRONG><\/P><\/P>Schauen wir uns an, wie man ein Eingabefeld erstellt, das Änderungen an der Eingabe an den Accessor bindet.<\/P><\/P> function createInput(\/*Accessor*\/)target, \/*FieldName*\/)name) {
var node = document.createElement('div');
node.setAttribute('class', 'form-group');
var lbl = document.createElement('label');
lbl.innerText = name;
var input = document.createElement('input');
input.setAttribute('class', 'form-control');
input.setAttribute('type', 'text');
input.setAttribute('name', name);
input.setAttribute('value', inputValue(target, name));
node.appendChild(lbl);
node.appendChild(input);
on(input, 'keyup', function(e) {
\/\/- den Accessor aktualisieren
target[e.target.name] = e.target.value;
});
return node;
}<\/PRE><\/P>In diesem Beispiel hören wir auf das keyup-Ereignis des Eingabefelds und aktualisieren den Accessor. Ziemlich einfach.<\/STRONG><\/EM><\/P><\/P><\/P>Jetzt kannst du auf Änderungen am Accessor achten und etwas damit machen. Wahrscheinlich möchtest du ein Update an einen FeatureService senden und einfach jede Änderung mit dem Service synchronisieren.<\/P><\/P>Um diese Bindung zu demonstrieren, werde ich das dynamisch generierte Formular an ein anderes Formular binden, das deaktiviert ist, um die Updates anzuzeigen.<\/P><\/P> qTask.execute(query).then(function (results) {
var feature = results.features[0];
var attr = new Accessor(feature.attributes);
Object.keys(attr).sort().map(function(key) {
\/\/- nur bestimmte Felder anzeigen
if (key !== 'OBJECTID' && key !== '_accessorProps') {
var node = createInput(attr, key);
var elem = document.getElementById(key);
elem.value = inputValue(attr, key);
\/\/- auf Updates achten und das deaktivierte Formular aktualisieren
attr.watch(key, function(val) {
elem.value = val;
 .& nbsp.& nbsp.& nbsp.& nbsp.& nbsp;} );
 .& nbsp.& nbsp.& nbsp.& nbsp.& nbsp;entryForm.appendChild(node);
 .& nbsp;}
});
});< /PRE >< P > Diese Methode führt die Abfrage des Dienstes aus und wandelt Attribute in einen Accessor um. Sie erstellt auch das dynamische Formular, aber beachte, dass sie auf Änderungen am Accessor achtet und das deaktivierte Formular aktualisiert. Hier könntest du auch Updates an einen FeatureService weitergeben, wenn du möchtest, vielleicht unter Verwendung der < A href = "http://odoe.net/blog/quick-tip-tools-for-arcgis-jsapi-4-0beta1/" rel = "nofollow noopener noreferrer" target = "_blank" > Bearbeitungswerkzeuge hier < /A > . < / P >< P >< STRONG > Du kannst dies in Aktion sehen in < A href = "http://jsbin.com/bugime/3/edit?js,output" rel = "nofollow noopener noreferrer" target = "_blank" > diesem JSBIN < /A > . < /STRONG >< / P >< P >< / P >< P > Hier ist eine etwas optimierte Version von < A href = "http://jsbin.com/bugime/6/edit?js,output" rel = "nofollow noopener noreferrer" target = "_blank" > diesem Beispiel < /A > . < / P >< PRE class = "lia-code-sample line-numbers language-none" > & nbsp ; qTask.execute(query).then(function (results) {
& nbsp ; & nbsp ; & nbsp ; var feature = results.features[0];
& nbsp ; & nbsp ; & nbsp ; var attr = new Accessor(feature.attributes);
& nbsp ; & nbsp ; & nbsp ; var props = Object.keys(attr).filter(function(key) {
& nbsp ; & nbsp ; & nbsp ; & nbsp ; return key !== 'OBJECTID' &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;' _accessorProps';
& nbsp ; & nbsp ; & nbsp ; }).sort();
& nbsp ; & nbsp ; & nbsp ; var nodeCache = {};
& nbsp ; & nbsp ; & nbsp ; attr.watch(props, function(val, _, name) {
& nbsp ; & nbsp ; & nbsp ; & nbsp ; var elem;
& nbsp ; & nbsp ; & nbsp ; & nbsp ; if (nodeCache[name]) {
& nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; elem = nodeCache[name];
& nbsp ; & nbsp ; & nbsp ; & nbsp ; } else {
& nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; elem = document.getElementById(name);
& nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; & nb sp nodeCache[name] = elem;
& nb sp }
& nb sp elem.value = val;
& nb sp });
& nb sp props.map(function(prop) {
& nb sp var node = createInput(attr, prop);
& nb sp var elem = document.getElementById(prop);
& nb sp elem.value = inputValue(attr, prop);
& nb sp entryForm.appendChild(node);
& nb sp });
});< /PRE >< P >< / P >< P > Das ist wirklich nicht so schwierig, wenn man es sich anschaut. Du kannst im Grunde genommen die Updates an den Accessor an andere Methoden delegieren und einfach beobachten, wann Änderungen daran stattfinden.< / P >< P >< / P >< P > Probier es aus, tauche tief in die Accessors ein und lass es auf dich wirken, < EM > du wirst nicht enttäuscht sein < /EM > . < / P >< P >< / P >< P > Für mehr geodev Tipps und Tricks , < A href= "http://odoe.net/blog/" rel= "nofollow noopener noreferrer" target= "_blank" > schau dir meinen Blog an < /A > . < /BODY >< /HTML >
