Question

我目前正在使用Bootstrap Modal打开＆amp;显示特定用户数据。我对用户数据（例如电子邮件等）没有任何问题，但是地图是另一个故事，因为加载了所有HTML，因此Angular Leaflet Directive脚本标记在页面加载时调用数据。但是，单击后会出现所选用户。我尝试使用jQuery函数来运行数据，但没有成功。

我的用户列表是使用重复的Angular指令创建的：

// inside the Modal "head" to link to modal content:
<tbody>
    <tr dir-paginate="snap in chatData | orderBy:sortType:sortReverse | filter:q | itemsPerPage: pageSize" current-page="currentPage" data-toggle="modal" data-target="#myModal" ng-click="modalDetails(snap)">
        <td>{{snap.requested_by}}</td>
        <td>{{snap.created_at | date: 'fullDate'}}</td>
        <td>{{snap.referrer_url || 'n/a'}}</td>
    </tr>
</tbody>

ng-click传入“snap”，这是所选用户（将其视为索引）。除地图外，每个用户的Snap都显示OK。

// inside the modal body tries to call the center & marker data before click:
<leaflet lf-center="center" markers="markers" height="240px" width="100%"></leaflet>

在我的Angular JS文件中：

//a new $scope variable is created based on passing the "snap" value from HTML
//but its data doesn't get sent to the HTML <leaflet> lines prior to page load.
$scope.modalDetails = function(snap) {
        $scope.selectedUser = snap
}

我想创建相当于：

angular.extend($scope, {
    center: {
            lat: $scope.selectedUser.latitude,
            lng: $scope.selectedUser.longtude,
            zoom: 8
            }
})

$scoper.markers[geo] = {
                       lat: $scope.selectedUser.latitude
                       lng: $scope.selectedUser.longitude
                       }

我对此有任何建议。无论是创建另一个ng-view还是包含一个包含模态体的单独HTML文件。或者通过运行一个新功能来阻止事件直到点击后。

Plnkr：https://plnkr.co/edit/cvaZRJpTEx0RMmy6I6OZ?p=preview

显示基于所选用户的单个标记，用于模态

0 个答案: