Question

我正在尝试创建popup html以进入leafletjs标记弹出窗口。

我有以下部分内容：

 <div class="popup">
        <div class="pull-right">
          <a class="popup-info" ng-click="onInfoClicked()">
            <i class="fa fa-info-circle"></i>
           </a>
        </div>

        <div class="popup-title">
          {{title}}
        </div>

        <div class="popup-subtitle">
          {{subtitle}}
        </div>
    </div>

以及以下指令：

app.directive('leafletPopup', function() {
  return {
    restrict: "A",
    templateUrl:  "app/partials/leaflet-popup.html",
    scope: {
      feature: '=',
      popupInfo: '&'
    },
    controller: function ($scope) {
      $scope.title = $scope.feature.properties.title;
      $scope.subtitle = $scope.feature.properties.description;

      $scope.onInfoClicked = function() {
         $scope.popupInfo({feature: feature});
      }
    }
  };
});

我有一个控制器，它提供了一个函数来为我要放在地图上的每个标记生成html：

function html(feature) {
  var el = angular.element('<div leaflet-popup="feature" popup-info="onPopupInfo(feature)"></div>');
  var compiled = $compile(el);
  var newScope = $scope.$new(true); // create new isolate scope
  newScope.feature = feature;  // inject feature into the scope
  newScope.onPopupInfo = function(feature) {  // inject function into scope
    // do something with the click
    showFeatureDetails(feature);
  }
  compiled(newScope);

  return el[0];
}

完美无缺。好的吗？

我已经在几个地方读过，不建议手动创建自己的范围，因为你必须确保你也手动销毁它。

假设我的地图上有一堆标记，每个标记都有一个弹出窗口。我是否需要跟踪我在控制器中创建的所有新范围并在其上调用destroy？什么时候？只有我的标记从地图中删除了吗？

我可以跳过angular并用jquery构建整个html元素并将onclick附加到一个函数，但这也不是很好。为什么跳过角？

似乎过于复杂，这可能意味着我正在努力做到这一点;）

以编程方式创建新的隔离范围

0 个答案: