angular.js - When adding Amap API to angularjs, the map display is not normal and the console reports an error. What is the solution?

Question

angular.module('drApp', ['ng', 'ngRoute', 'ngAnimate'])
.controller('startCtrl', ['$scope',function ($scope) {
var map = new AMap.Map('container');
            map.setZoom(16);
            map.setCenter([116.397428, 39.90923]);
      var marker = new AMap.Marker({
                position: [116.397428, 39.90923],
                map: map
            });
            
  }]);

Error message: Uncaught ReferenceError: map is not defined

The map printed by the console:

Error purchasing source:

Answer 1

var map = new AMap.Map('container');

Put this map console out and take a look

Answer 2

Isn’t this a scope issue?

And also, angular runs after window.onload