Querying a FeatureLayer with Angular JS

EvelynHernandez — Sun, 12 Dec 2021 04:46:30 GMT

Hey there.

Im starting to develop a little app that it has to search a value in a feature layer and give the result in some html List and also make a zoom in a map with the current location (i would like to add the infotemplate from the feature).

Im programming with esri-angular api, but i dont find any example of :

1.- How to query data from a featurelayer

2.- How to make a zoom to the founded feature.

3.- Is there a way to not use this to add the feature layers and doing it through code?

<esri-feature-layer url="http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Heritage_Trees_Portland/FeatureServer/0"></esri-feature-layer>

<esri-feature-layer url="http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Portland_Parks/FeatureServer/0"></esri-feature-layer>

Thanks in advice for ur help guys as always

I just have this on my code:

Mapa.JS

 angular.module('myApp', ['esri.map'])
                .controller('MapController', function ($scope) {
                    $scope.map = {
                        center: {
                            lng: -71.51079005370974,
                            lat:  -33.0324567956618},
                        zoom: 10
                    };
                });

Html File:

 <div class="content-block contact-3 bg-clouds" id="busqueda" ng-controller="MapController">
            <div class="container">
                <div class="row">
                    <div class="underlined-title">
                        <h1>Buscar NIS de Cliente</h1>
                        <hr>
                    </div>
                    <div class="row">
                        <form role="form">
                            <div class="col-md-4"> 
                                <div class="form-group"> 
                                    <label class="control-label" for="formInput13">Ingrese el NIS del cliente a buscar:</label>
                                    <input type="text" class="form-control" id="formInput13" placeholder="NIS" required>
                                </div>                                 
                            </div>
                            <div class="col-md-4">
                                <button type="button" class="btn btn-default btnBuscar bg-moonlight offwhite" id="searchBtn">
                                    <i class="fa fa-search"></i> Buscar
                                </button>                                 
                            </div>                             
                        </form>
                    </div>
                    <div class="col-md-6">
                        <div id="contact" class="form-container">
                            <h2>Resultados de la búsqueda:</h2>
                            <fieldset>
                                <ul> 
                                    <li>Lat: {{map.center.lat}}</li>  
                                    <li>Address: {{map.layer.address}}</li>                                      
                                    <li>Pipe: {{map.layer.pipe}}</li>                                     
                                    <li>Status: {{map.layer.status}}</li>                                     
                                    <li>Nulla volutpat aliquam velit    
                                        <ul> 
                                            <li>Phasellus iaculis neque</li>                                             
                                            <li>Purus sodales ultricies</li>                                             
                                        </ul>                                         
                                    </li>
                                </ul>
                                
                                 
                            </fieldset>
                            <p>
                                    Lat:<input type="number" step="0.1" ng-model="map.center.lat" />
                                    Lng:<input type="number" step="0.1" ng-model="map.center.lng" />,
                                    Zoom: <select ng-model="map.zoom" ng-options="level for level in [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]"></select>
                                    
                                </p>
                        </div>
                        <!-- /.form-container -->
                    </div>
                    <div class="col-md-6">
                        <h2>Ubicación</h2>
                        <p>Lugar donde actualmente se encuentra el NIS.</p>
                        <div class="row pg-empty-placeholder containerMap"><esri-map id="map" center="map.center" zoom="map.zoom" basemap="topo"></esri-map>
                          
                        </div></div>
                    </div>
                </div>
                <!-- /.row -->
            </div>
            <!-- /.container -->
        </div>

Re: Querying a FeatureLayer with Angular JS

EvelynHernandez — Tue, 29 Dec 2015 13:25:27 GMT

How can i integrate angularjs with arcgis api?...

Its very simple what i want to do but idk how to put things together 😞

Re: Querying a FeatureLayer with Angular JS

BjornSvensson — Tue, 29 Dec 2015 23:48:09 GMT

Evelyn Hernandez - take a look at http://esri.github.io/angular-esri-map/.

Re: Querying a FeatureLayer with Angular JS

EvelynHernandez — Wed, 30 Dec 2015 02:04:14 GMT

Actually i know about it, thats why theres not an example about querying a featurelayer.

It needs more docs of a lot of things.

Anyways, i resolved my problem in another way, i will post it tomorrow, but idk if its the best practice to do it.

Enviado desde Correo de Windows

De: Bjorn Svensson

Enviado el: ‎martes‎, ‎29‎ de ‎diciembre‎ de ‎2015 ‎20‎:‎49

Para: Evelyn Elena Hernández Riquelme

GeoNet

Querying a FeatureLayer with Angular JS

reply from Bjorn Svensson in ArcGIS API for JavaScript - View the full discussion

Evelyn Hernandez - take a look at http://esri.github.io/angular-esri-map/.

Reply to this message by replying to this email, or go to the message on GeoNet

Start a new discussion in ArcGIS API for JavaScript by email or at GeoNet

Following Querying a FeatureLayer with Angular JS in these streams: Inbox

This email was sent by GeoNet because you are a registered user.

You may unsubscribe instantly from GeoNet, or adjust email frequency in your email preferences

topic Re: Querying a FeatureLayer with Angular JS in ArcGIS JavaScript Maps SDK Questions

Querying a FeatureLayer with Angular JS

Re: Querying a FeatureLayer with Angular JS

Re: Querying a FeatureLayer with Angular JS

Re: Querying a FeatureLayer with Angular JS