看了AngularJS官网的一些例子,觉得很给力,将开发人员的注意力从满屏的DOM操作中转移到传统的业务中,以数据为中心,绑定View,实现二者的绑定和更新。
自己平时做的较多的是地图类应用,类似百度地图PC版和腾讯地图那种,考虑过用AngularJS,可是想来想去觉得不大合适,主要原因是地图类应用一般依赖第三方地图API,比如基于百度地图需要百度地图Javascript API,腾讯也有自己的JS API,这些API的普遍概念是提供一个页面元素,然后在这个元素里创建一个可交互的地图界面。
1 地图初始化
假如我们希望在页面div#map-div这个位置创建一个地图,通常代码如下:
<div id="map-div"></div>
var map=new BMap.Map("map-div",{});
这个map对象有包含了许多方法比如添加叠加物、地图绘制等,这些方法大多数又会引起地图界面的更新,比如下面的代码会在地图界面上弹出一个窗口:
map.addInfoWindow();
如果按照AngularJS的里面,我们应该在页面里声明一个地图的View,类似这样
这样的话,我们需要创建一个bd-map
的directive
,意味着需要针对不同的地图SDK建立不同的directive,虽然这个是一劳永逸的工作,算起来这个不算啥。
2 地图交互
这一块我觉得如果完全通过AngularJS封装会导致把简单问题复杂化,比如我从后台请求了10个酒店的数据markers
,每个酒店有一个位置信息,一般情况下,我会这么干:
for(var i......){
var item=...
var marker=new BMap.Marker(...);
map.addOverlay(marker);
}
但是按照AngularJS的理念,markers
明显应该是某个scope
里面的数据,我们的业务应该关注在这个数据的获取和更新上,界面的更新应该交由directive
完成,于是我好像还需要创建marker
对应的directive,到这一步我已经觉得有点复杂了,有一种多此一举的感觉。
3 事件
地图本身,以及地图上面的叠加物多少都有一些事件的,比如你点击了地图,点击了一个图标等等,这些在地图类应用里面很常见,如果使用AngularjS的话好像又要封装一下。
我的感觉是,地图类SDK本身已经可以看作是一个MVC的实现,比如你把地图的各种参数(数据)设置好,然后通过一句SDK提供的接口,一个地图界面(View)就创建了,通过修改地图中心点等接口,地图视图也跟着变化,这种情况下跟AngularJS强行结合好像会适得其反,这种情况我觉得还是Backbone更合适一点,毕竟Backbone的view还是比较灵活的,Model的渲染完全在自己手里,可以手工操作dom,也可以调用通过地图SDK完成,并没有耦合的很紧密,不需要额外的工作。
学AngularJS时间比较短,大概1周,有这种想法,不知道有没有哪里理解不到位的地方?
补充,我觉得AngularJS最适合的场景是应用只需要原生的页面元素的组合,比如不同的view只是将数据注入到不同的template的中,比如todolist,gmail这种,就是原生html元素的拼凑。