Accessors voor data-binding

ReneRubalcava

<\/HEAD>

<\/P>

Dus ja, ik heb een zekere affiniteit voor Accessors<\/A> in de ArcGIS JS API 4.0 beta<\/A>.<\/P>

<\/P>

Ik heb er

veel over geschreven<\/A>.<\/P>

<\/P>

Ze zijn ongelooflijk veelzijdig, waardoor je dingen kunt doen die je niet kon doen met gewone event watching in de 3.x API. Je kunt spelen met de camera, de status van je applicatie opslaan en veel veel meer<\/EM>.<\/P><\/P>Laatst dacht ik na over

mogelijke bewerkings-<\/A> en tekeningscenario's<\/A> die je uit Accessors kunt halen. Vaak bewerk je niet alleen geometrie, je bewerkt attributen<\/EM>. Ik heb geëxperimenteerd met hoe jij als ontwikkelaar Accessors kunt gebruiken om dit te realiseren.<\/P><\/P>Ik ga hier niet in detail, je kunt de details voor velden krijgen van de laaggegevens die terugkomen van de ArcGIS REST API<\/A>. Dit vertelt je welke velden beschikbaar zijn, wat bewerkbaar is, wat het veldtype is, wat echt krachtige informatie is voor bewerking. Je kunt deze informatie gebruiken om dynamisch je bewerkingsformulieren voor je applicatie te maken.<\/P>

<\/P>

We vereenvoudigen dit scenario een beetje.<\/EM><\/P><\/P>Laten we gewoon aannemen dat je het volgende wilt doen:<\/P>Invoervelden weergeven voor elk attribuutveldBinden van wijzigingen in de invoer aan de attributenDie wijzigingen weergeven<\/LI>Accessors kunnen ons dit laten doen.<\STRONG><\P><\P>Laten we kijken naar het maken van een invoer die wijzigingen in de invoer bindt aan de Accessor.<\P><\P>  function createInput(\/*Accessor*\/)target, \/*FieldName*\/)name) {\n    var node = document.createElement('div');\n    node.setAttribute('class', 'form-group');\n    var lbl = document.createElement('label');\n    lbl.innerText = name;\n    var input = document.createElement('input');\n    input.setAttribute('class', 'form-control');\n    input.setAttribute('type', 'text');\n    input.setAttribute('name', name);\n    input.setAttribute('value', inputValue(target, name));\n    node.appendChild(lbl);\n    node.appendChild(input);\n    on(input, 'keyup', function(e) {\n      \/\/- update the accessor\n      target[e.target.name] = e.target.value;\n    });\n    return node;\n  }<\/PRE><\/>In dit voorbeeld luisteren we naar het keyup-event van de invoer en updaten we de Accessor. Best simpel.<\STRONG>

Nu kun je veranderingen aan de accessor volgen en er iets mee doen. Je zou waarschijnlijk een update willen sturen naar een FeatureService en elke update eenvoudig synchroniseren met de service.

Om deze binding te demonstreren, verbind ik het dynamisch gegenereerde formulier met een ander formulier dat is uitgeschakeld om de updates te tonen.

  qTask.execute(query).then(function (results) {\n    var feature = results.features[0];\n    var attr = new Accessor(feature.attributes);\n    Object.keys(attr).sort().map(function(key) {\n      \/\/- alleen bepaalde velden weergeven\n      if (key !== 'OBJECTID' &'_accessorProps') {\n     &nbs...