ArcGIS JavaScript API弹出窗口未引用REST服务层

如何解决ArcGIS JavaScript API弹出窗口未引用REST服务层

通过变量“ popupCustom”创建的弹出窗口中的内容显示的是字符串，而不是引用指定的字段{IN_COUNTRY}。我遵循了ArcGIS JS API弹出教程，但看不到我的错误是无法获取与该字段关联的属性。这是代码-非常感谢您的帮助！

*注意：“ Cyber_Areas”变量中的要素图层网址指向所引用要素类的REST URL。

<!DOCTYPE html>
<html>
<head>
  <Meta charset="utf-8">
  <Meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Search widget with multiple sources - 4.6</title>

  <style>
    html,body,#viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.6/esri/css/main.css">
  <script src="https://js.arcgis.com/4.6/"></script>

  <script>
    require([
      "esri/Map","esri/views/MapView","esri/widgets/BasemapToggle","esri/widgets/Legend","esri/layers/TileLayer","esri/layers/FeatureLayer","esri/widgets/Search","esri/widgets/LayerList","esri/PopupTemplate","dojo/on","dojo/domready!"
      
    ],function(
      Map,MapView,BasemapToggle,Legend,TileLayer,FeatureLayer,Search,LayerList,PopupTemplate,on
      ) {

      var Cyber_Areas = new FeatureLayer({
        url: "*inserturl*",outFields: ["IN_COUNTRY"],popupTemplate: popupCustom 
      });

      var map = new Map({
        basemap: "osm"
      });

      map.add(Cyber_Areas);

      var view = new MapView({
        container: "viewDiv",map: map,center: [-87.172865,34.077613],// lon,lat
        zoom: 16
      });

      var searchWidget = new Search({
        view: view,popupOpenOnSelect: false
      });
      
      view.ui.add(searchWidget,{
        position: "top-left",index: 0
      });
      
      var popupCustom = searchWidget.on('select-result',function(evt){
       //console.info(evt);     
        view.popup.open({
          location: evt.result.feature.geometry,// location of the click on the view
          title: "Service Availability:",// title displayed in the popup
          content: "<p><b>{IN_COUNTRY}"
        });
      });

    });
      
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>
</html>

解决方法

在您的代码中，您正在混合弹出模板值和何时显示它。那是两件事。

首先，您没有正确设置图层的弹出模板。它应该是PopupTemplate。

在我看来，在您编写的代码中，图层定义应该是这样的，

var Cyber_Areas = new FeatureLayer({
  url: "*inserturl*",popupTemplate: {
    outFields: ["IN_COUNTRY"],title: "Service Availability:",content: "<p><b>{IN_COUNTRY}</b></p>"
  } 
});

现在，如果您不希望弹出窗口具有默认行为（在功能上单击鼠标左键），则无法像这样禁用它，

view.popup.autoOpenEnabled = false; // <- disable view popup auto open

然后您可以在任何需要的地方打开它，

view.popup.open({ // <- open popup
  location: evt.result.feature.geometry,// <- use map point of the event result
  fetchFeatures: true // <- fetch the selected features (if any)
});

您必须了解，在弹出模板的内容中使用的字段与图层相关。这就是为什么我在视图的弹出窗口中设置以获取结果。