将对象作为ng-map标记的一部分传递

肖恩·雅各布

ng-mapAngular JS中使用标记

<ng-map zoom-to-include-markers="auto" default-style="false" class="myMap">
    <marker ng-repeat="Customer in ListForDisplay"  position="{{Customer.location.lat}},{{Customer.location.lng}}" icon="{{Customer.icon}}" clickedaddress="{{Customer.address}}" clickedextras="{{Customer.extrasString}}" data="{{Customer}}"  on-click="markerSingleClick($event)" on-dblclick="markerDoubleClick($event)"></marker>
</ng-map>

我可以在控制器中访问字符串变量,但是对象数据在调试会话中仍然未定义:

$scope.markerSingleClick = function (event) {
     var clickedaddress = this.clickedaddress;
     var clickedextras = this.clickedextras;
     var data = this.data;

有没有办法将整个对象作为标记的一部分而不是单个字符串属性传递

瓦迪姆·格雷米亚切夫(Vadim Gremyachev)

要通过标记on-click事件将当前对象作为参数传递,请替换

on-click="markerSingleClick($event)"

on-click="markerSingleClick({{Customer}})"

然后更新markerSingleClick功能:

$scope.markerSingleClick= function (event,customer) {
    //...          
}; 

工作实例

angular.module('mapApp', ['ngMap'])
    .controller('mapCtrl', function ($scope, NgMap) {


        NgMap.getMap().then(function (map) {
            $scope.map = map;
        });
        $scope.cities = [
            { id: 1, name: 'Oslo', pos: [59.923043, 10.752839] },
            { id: 2, name: 'Stockholm', pos: [59.339025, 18.065818] },
            { id: 3, name: 'Copenhagen', pos: [55.675507, 12.574227] },
            { id: 4, name: 'Berlin', pos: [52.521248, 13.399038] },
            { id: 5, name: 'Paris', pos: [48.856127, 2.346525] }
        ];

        $scope.showInfo = function (event,city) {
              alert(JSON.stringify(city));
              //console.log(city);
        };
    });
<script src="https://code.angularjs.org/1.4.8/angular.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key="></script>
    <script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script> 
<div ng-app="mapApp" ng-controller="mapCtrl">
        <ng-map zoom="5" center="59.339025, 18.065818">            
            <marker ng-repeat="c in cities" position="{{c.pos}}" title="{{c.name}}" id="{{c.id}}" on-click="showInfo({{c}})">
            </marker>
        </ng-map>
    </div>


另一种选择是将对象标识符作为参数传递,例如其索引:

<marker ng-repeat="c in cities" on-click="showInfo($index)" position="{{c.pos}}" title="{{c.name}}" id="{{c.id}}">
</marker>

然后可以像这样确定当前对象:

$scope.showInfo = function (event,index) {
     var currentCity = $scope.cities[index]; 
     //console.log(currentCity);
};

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

将数组作为对象的一部分传递给Ajax调用

通过Rest调用在json中传递fk作为DerivedIdentities的一部分

在作为回调一部分的嵌套函数中传递或访问变量

将 null 作为 vararg 参数的一部分从 Kotlin 传递给 Java 方法

函数未作为本机反应中道具的一部分传递

如何传递会话ID作为Soap请求的一部分?

将参数作为查询字符串或 url 的一部分传递?

将cookie作为node.js请求的一部分传递

如何在PowerShell中将参数作为-file的一部分传递

如何在SwiftUI中将View()作为列表的一部分传递?

NSNotificationCenter将结构作为UserInfo的一部分传递

如何在PHP中将“&”作为字符串的一部分传递?

Django-作为包含的一部分传递flatpage.title变量

ASP.NET MVC传递参数作为url的一部分

作为ROBOT框架的一部分传递--form数据

将 --form 文件作为 ROBOT 框架的一部分传递

map 的静态 init 与作为声明的一部分的 init

Netty单元测试:如何测试作为传递的ChannelHandlerContext一部分的Channel对象的调用?

将嵌套的 Json 对象的一部分转换为 Java Map

Promise 作为 redux 状态的一部分

使用变量作为语句的一部分

块作为块的一部分

if 条件作为 GIT 命令的一部分

UiSegmentedControl作为UILabel子类的一部分

将标题作为CURL的一部分

在ng-click中将对象作为参数传递

复制Java对象数组的一部分

使用路径访问对象的一部分

验证对象Spring的一部分