Angularjs 地图不会在第一次单击时显示点

Angularjs 地图不会在第一次单击时显示点,angularjs,html,leaflet,Angularjs,Html,Leaflet,这是我的问题 这是我的控制器: angular.module('app') .controller('HomeController', HomeController) function HomeController($state,$http,$scope){ var vm = this; var mylist, lp; var showPoints = function(){ $htt

这是我的问题 这是我的控制器:

    angular.module('app')
     .controller('HomeController', HomeController)

        function HomeController($state,$http,$scope){

        var vm = this;
        var mylist, lp;

        var showPoints = function(){
            $http.get('api/map').success(function(response){ 
                 mylist= response;
                 vm.selectList = mylist;
                 $scope.vm.objectSelected = mylist[0];
                 $scope.showCordinates($scope.vm.objectSelected );
        });
        }

        showPoints();

        $scope.showCordinates = function(obj){
            $scope.vm.objectSelected =obj;
            lp = obj.mynumber;
            $http.get('api/device/'+lp).success(function(response){
                    $http.get('api/provider/'+response.devId+'/'+obj._id).success(function(response){
                   $scope.vm.objectSelected.locations = response;

}
这是我的html代码:

<table class="table table-hover table-striped" style="margin-left:5px;">
        <thead>
            <tr>
                <th class="p-t-4"><h4>Serial Number</h4></th>
            </tr>        
        </thead>
        <tbody>
            <tr ng-class="{selected:vm.objectSelected===obj}" ng-repeat="obj in vm.selectList | filter:search" ng-click="showCordinates(obj)"> 
                <td>{{obj.mynumber}}</td>
            </tr>
        </tbody>
    </table>

<map object="vm.objectSelected" > </map>

序列号
{{obj.mynumber}
预期的行为是,如果单击表格上列出的序列号,则必须刷新我的地图,以根据clic(在预期位置)显示点。不幸的是,我的应用程序就是这样:如果我第一次点击序列号,什么都没发生。我必须首先单击另一个序列号,最后再次单击上一个序列号以刷新地图并显示其点。 我不明白为什么会发生这种错误。
“我的地图”由传单库管理。

您的默认传单地图设置是什么?当我使用它时,我总是需要用一个默认的起点来“扩展”我的控制器,比如:

angular.module('app')
.controller('defaultmap',['$scope', '$http', 'leafletData', function($scope, $http, leafletData){

angular.extend($scope, {
    center: {
            lat: 27.4086665,
            lng: 1.7576433,
            zoom: 3
            },
    defaults: {
            scrollWheelZoom: false
            }
});

$scope.onloadMap = function() {
    $http.get('api/lib').success(function(data, status) {
        angular.extend($scope, {
            geojson: {
                data: data,
                style: function(feature){
                  var myStyles = {
                    fillColor: '#5e5e5e',
                    weight: 1,
                    opacity: 1,
                    color: 'white',
                    fillOpacity: 0.7
              }
          }
      }
    }
  )}
)}
}]);

必须在我的html中插入onloadMap的位置?您可以设置另一个html元素,如:调用控制器时onloadMap自行运行。此Angular传单指令确实有帮助: