AnsweredAssumed Answered

Defining popup template in own module

Question asked by llassetter on Jun 20, 2020

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) {

 

  
    //
    // 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

Attachments

Outcomes