2013-04-22 59 views
-1

我正在使用Durandal/Hot Towel SPA与Bing地图库http://soulsolutions.com.au/Blog/tabid/73/EntryId/818/Knockout-JS-and-Bing-Maps.aspx。这个库创建自定义的ko绑定来访问地图控件。Durandal/Hot Towel SPA,Bing地图和淘汰赛自定义绑定

有了杜兰达这个绑定只能以一种方式工作。可以在更改后从地图控制中获取值(例如缩放级别),但是当我想在单击它不工作后设置缩放级别时可以。

在Durandal之外,当我在一个简单的html页面上测试它时,一切都很好。

任何想法有什么不对?任何帮助将不胜感激。

我的视图模型:

var mapVM = function() { 
    this.map = { 
     options: { 
      credentials: "bing key", 
      customizeOverlays: true, 
      showScalebar: false, 
      showMapTypeSelector: false, 
      enableClickableLogo: false, 
      enableSearchLogo: false, 
     }, 
     mapview: { 
      zoom: ko.observable(4).extend({ throttle: 1 }), 
     }, 
    }; 

    this.testZoom = function() { 
     this.map.mapview.zoom(5); 
    }; 
}; 

观点:

<input data-bind='value: map.mapview.zoom, valueUpdate: "afterkeydown"' /> 
<input type="button" data-bind="click: testZoom" value="test zoom" /> 
<div id="mapControl" data-bind="bingmaps: { map: map }" style="position: relative; width: auto; height: 400px"> 
+0

我怀疑testZoom函数中的“this”值不是你认为它引用的内容。在你的mapVM中创建一个名为self的变量,并将它指向这个var self = this;并在this.testZoom中,引用self.map.mapview.zoom(5)。告诉我,如果这样工作 – 2013-04-22 19:55:23

+0

你可以看看你的console.log,并检查是否有任何错误报告。 – 2013-04-23 17:20:57

+0

@evan日志为空 – Damian 2013-04-26 13:57:25

回答

0

我觉得你testZoom工作正常。但在函数内部的参考this没有map属性:

var mapVM = function() { 
    var that = this; 
    that.map = { 
     options: { 
      credentials: "bing key", 
      customizeOverlays: true, 
      showScalebar: false, 
      showMapTypeSelector: false, 
      enableClickableLogo: false, 
      enableSearchLogo: false, 
     }, 
     mapview: { 
      zoom: ko.observable(4).extend({ throttle: 1 }), 
     }, 
    }; 

    that.testZoom = function() { 
     that.map.mapview.zoom(5); 
    }; 
}; 
+0

同样的问题,它不起作用。 – Damian 2013-04-23 09:02:31

0

@Damian,我试图破解路由器的routeinfo以支持嵌套的菜单和携带物品,但不知道安全。你可以看看here