Creating a Collection of FeatureLayerViews

[MichaelNesius1]

Hi Esri Community,

I'm trying to build a Collection of FeatureLayerViews  but I am getting a "W is not a function" when I execute  try to .add(layerView)

Any suggestion would be greatly appreciated.

Codepen reproducing my error (code shown below)

require(["esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer", "esri/views/layers/FeatureLayerView","esri/core/Collection"], 
        function(Map, MapView, FeatureLayer, FeatureLayerView, Collection) {
        const map = new Map({
          basemap: "dark-gray-vector"
        });

        const view = new MapView({
          container: "sceneDiv",
          map: map,
          center: [-73.95, 40.702],
          zoom: 12,
          padding: {
            right: 300
          }
        });

        /********************
         * Add feature layers
         ********************/

        // Create the FeatureLayers
        const FLUrls =[
            {url:"https://sampleserver6.arcgisonline.com/arcgis/rest/services/EmergencyFacilities/FeatureServer/0", title: "Facilities", id: "Facilities"},
            {url:"https://sampleserver6.arcgisonline.com/arcgis/rest/services/LocalGovernment/WaterValveInspections/FeatureServer/0", title: "Water", id: "Water"},
            {url:"https://sampleserver6.arcgisonline.com/arcgis/rest/services/LocalGovernment/SewerManholeInspections/FeatureServer/0", title: "Sewer", id: "Sewer"}
        ]
        const FLs = FLUrls.map( (x) => (
            new FeatureLayer({
                url:  x.url,
                title: x.title,
                id: x.id,
                visible: false
            } )
        ));
        const show = (...a) => console.log(...a);
        const layerTitles = a => show(a.title);
        const layerIDs = a => show(a.id);
        const layerViews = a => {
          console.log("feature layer view a:  " + a.title)
          view.whenLayerView(a)
            .then( layerView => {
              console.log("when layer view:  " + layerView.layer.title)
              try{
                featureLayersViews.add(layerView);
                // Not sure why add() is throwing "W is not a function"
              } catch(e) {
                console.error("\t" + e.message)
              }
            })
          .catch(err => {
            console.log("error with feature layer view: " )//+ layerView.layer.title)
            console.error(err)
          })
        };
        const addLayerResults = results => {
            // Add the FeatureLayers to the map
            map.addMany(results)
            //console log the titles of the layers
            results.map(layerTitles)
            // pass the layers to a whenLayerView function that adds them to the view Collection
            results.map(layerViews)
        }
        
        //collection of FeatureLayers
        let FeatureLayerCollection = Collection.ofType(FeatureLayer);
        const featureLayers = new FeatureLayerCollection();
        
        //collection of FeatureLayersViews
        let FeatureLayerViewCollection = Collection.ofType(FeatureLayerView);
        const featureLayersViews = new FeatureLayerViewCollection();
  
        featureLayersViews.on("after-add", event => {
            console.log(`${event.item.title} was added to featureLayersViews collection`);
        })
  
        featureLayers.on("after-add", event => {
            console.log(`${event.item.title} was added to featureLayers collection`);
        })
  
        featureLayers.addMany(FLs);
        view.when( function () {
          console.log("View loaded ");
          Promise.all(featureLayers.map(a => a.load()).toArray())
                    .then(addLayerResults)
                    .catch(show)
         }
        )
     })

[ReneRubalcava · Accepted solution]

You don't need a typed Collection

Collection.ofType(FeatureLayerView)

When you do this, the Collection will try to initialize the added object as a new FeatureLayerView() and that doesn't work because it's already a class.

If this is for TypeScript, you can do this.

const featureLayersViews = new Collection<FeatureLayerView>();