Defining popup template in own module

327
0
06-20-2020 05:00 PM
by Anonymous User
Not applicable

I am pretty new to Javascript and Esri's JSAPI.  I am trying to create a popup template for a template.  I have it working as long as they are all in one file/module.  When I try to separate the Popup template code into it's own, I am getting an error that says the 'content' is undefined.  I as trying to use a function for the template's content.

I have attached my code which is pretty simple.  I put the project in a zip file.  All you have to do is run with a web server.

If you want a quick view here:

 

MyPopupTemplate.js

define(["dojo/base_/lang"], function (lang) {
  
  function setContentInfo(f) {
    var attrs = feature.graphic.attributes;
    return "Name: {Name}  CrimeRate: " + attrs.CrimeRate + "NarcoticsC: {NarcoticsC}"
  }
  
  return {
 
    template: {
      title: "{FID}",
      outFields: ["*"],
      content: this.setContentInfo,
      // content: "Name: {Name}  CrimeRate: {CrimeRate}  NarcoticsC: {NarcoticsC}",
    },
  }
})

   

main.js

require([
  "dojo/_base/lang",
  "esri/Map",
  "esri/views/MapView",
  "esri/layers/FeatureLayer",
  "esri/geometry/Extent",
  "esri/geometry/SpatialReference",
  "js/MyPopupTemplate"
], function (langMapMapViewFeatureLayerExtent
             SpatialReferenceMyPopupTemplate) {

  var crimeUrl = "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Chicago_Crime_Tracts/FeatureServer/0";
  
    //
    // first do popup templates
    //
    // var myPopup = {
    //   title: "{FID}",
    //   outFields: ["*"],
    //   content: setContentInfo,
    //   // content: "Name: {Name}  CrimeRate: {CrimeRate}  NarcoticsC: {NarcoticsC}",
    // };

    // function setContentInfo(feature){
    //   var attrs = feature.graphic.attributes;
    //   return "Name: {Name}  CrimeRate: " + attrs.CrimeRate + "NarcoticsC: {NarcoticsC}"
    // }
  
  
  
  var crimeLayer = new FeatureLayer({
    url: crimeUrl,
    // outFields: ["*"],
    popupTemplate: MyPopupTemplate.template
    // popupTemplate: myPopup
  });

  // var equipPopupTemplate = {
  var map = new Map({
    basemap: "topo-vector",
  });

  // make it a global for chrome debugger console
  view = new MapView({
    container: "viewDiv",
    map: map,
    center: [-87.6641.84],
    zoom: 10
  });

  map.add(crimeLayer);

});

when I use MyPoupTemplate.template for the feature layer's popupTemplate - I get the error saying content is undefined.

Thanks for the help

0 Kudos
0 Replies