Example of the combination of AngularJS and Baidu Maps

A project I am working on now is angular, but I introduced js by directly referencing Baidu Map, and wrote html and js code. I found that I went and reported an error. I thought at first that there was a conflict between Baidu Map and angular, and then I went to search and found that angular also has a Baidu map plug-in. Unfortunately, I used it and reported an error. It said on the Internet that you need to use the angular2 version to be compatible, but I didn’t know how to download the 2 version, so I gave up. Then, I I went to solve the mistake I made at the beginning, and found that I was stupid. First, let’s talk about how to use Baidu Maps. It’s very simple. First, introduce js

Explain that you can find the secret key on Baidu Map’s api official website Apply

and then html

Then when you get there, just go to the js code. In fact, all of these APIs are available, but I'll post them anyway

var map = new BMap.Map("map");  // 创建Map实例
        map.centerAndZoom(new BMap.Point(115.864528, 28.687675), 11); // 初始化地图,设置中心点坐标和地图级别
        map.addControl(new BMap.MapTypeControl());  //添加地图类型控件
        map.setCurrentCity("南昌");     // 设置地图显示的城市 此项是必须设置的
        map.enableScrollWheelZoom(true);   //开启鼠标滚轮缩放

I used these js codes behind the body at first, but an error was reported. What’s wrong? Post it

getscript?v=2.0&ak=your secret key&services=&t=20160928173929:1 Uncaught

TypeError: Cannot read property 'fc' of undefined

Well, this error occurred, let me go, the solution to this error is very simple

Just put the js code under the div where you use the map, and paste the code

That’s it, no error was reported, and the map was presented perfectly. Let me go. In the final analysis, I was too stupid. I thought there was a conflict with angular. Then I thought about it, it’s impossible, and then I didn’t research the Baidu plug-in for angular