Javascript 角度指令isn'；t更新谷歌地图值

我有一个名为“myMap”的指令，用于添加GoogleMap。 当我尝试使用我的控制器函数再次更新经度和纬度不同的位置时，它不会更新指令值。正在显示相同的地图

这是我的指示：

directive('myMap', function () {
    // directive link function
    var link = function (scope, element, attrs) {
        var map, infoWindow;
        var markers = [];

        // map config
        var mapOptions = {
            center: new google.maps.LatLng(attrs.latitude, attrs.longitude),
            zoom: 12,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            scrollwheel: false
        };

        // init the map
        function initMap() {
            if (map === void 0) {
                map = new google.maps.Map(element[0], mapOptions);
            }
        }

        // place a marker
        function setMarker(map, position, title, content) {
            var marker;
            var markerOptions = {
                position: position,
                map: map,
                title: title,
                icon: 'https://maps.google.com/mapfiles/ms/icons/green-dot.png',
                animation: google.maps.Animation.Bounce

            };

            marker = new google.maps.Marker(markerOptions);
            markers.push(marker); // add marker to array

            google.maps.event.addListener(marker, 'click', function () {
                // close window if not undefined
                if (infoWindow !== void 0) {
                    infoWindow.close();
                }
                // create new window
                var infoWindowOptions = {
                    content: content
                };
                infoWindow = new google.maps.InfoWindow(infoWindowOptions);
                infoWindow.open(map, marker);
            });
        }

        // show the map and place some markers
        initMap();

        setMarker(map, new google.maps.LatLng(attrs.latitude, attrs.longitude), attrs.restname, attrs.address);

    };

    return {
        restrict: 'A',
        template: '<div id="gmaps"></div>',
        replace: true,
        link: link
    };
});

指令（'myMap'，函数（）{ //定向链接功能 变量链接=函数（范围、元素、属性）{ var映射，信息窗口； var标记=[]； //地图配置 变量映射选项={ 中心：新的google.maps.LatLng（属性纬度，属性经度）， 缩放：12， mapTypeId:google.maps.mapTypeId.ROADMAP， 滚轮：错误 }; //初始化地图 函数initMap（）{ 如果（映射===void 0）{ map=new google.maps.map（元素[0]，mapOptions）； } } //放置标记 功能设置标记（地图、位置、标题、内容）{ var标记； 变量标记选项={ 职位:职位,， 地图：地图， 标题:标题,， 图标：'https://maps.google.com/mapfiles/ms/icons/green-dot.png', 动画：google.maps.animation.Bounce }; marker=新的google.maps.marker（markerOptions）； markers.push（marker）；//将marker添加到数组 google.maps.event.addListener（标记，'click'，函数（）{ //如果未定义，则关闭窗口 如果（信息窗口！==void 0）{ infoWindow.close（）； } //创建新窗口 var infoWindowOptions={ 内容：内容 }; infoWindow=newgoogle.maps.infoWindow（infoWindowOptions）； 信息窗口。打开（地图、标记）； }); } //显示地图并放置一些标记 initMap（）； setMarker（map，新的google.maps.LatLng（attrs.latitude，attrs.longitude），attrs.restname，attrs.address）； }; 返回{ 限制：“A”， 模板：“”， 替换：正确， 链接：链接 }; }); 之后，我将从HTML调用此指令。这是我的HTML：

<div class="gmaps"   my-map="" latitude="{{home.latitude}}" longitude="{{home.longitude}}"></div>

我被这件事缠住了。我使用了不同的方法，但在我的情况下不起作用。 如何检查指令参数的不同变化，以便分析经纬度的更新值？

---

请帮帮我？

在指令中添加观察者

 attrs.$observe("value", function (data) {},true);

它观察指令参数的变化，并在发生变化时进行更新。
在你的情况下是这样的

lahorefoodsWebSiteModule.directive('myMap', function () {
// directive link function
var link = function (scope, element, attrs) {
    attrs.$observe("latitude", function (latitude) {
        //This gets called when data changes.

    var map, infoWindow;
    var markers = [];

    // map config
    var mapOptions = {
        center: new google.maps.LatLng(attrs.latitude, attrs.longitude),
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        scrollwheel: false
    };

    // init the map
    function initMap() {
        if (map === void 0) {
            map = new google.maps.Map(element[0], mapOptions);
        }
    }

    // place a marker
    function setMarker(map, position, title, content) {
        var marker;
        var markerOptions = {
            position: position,
            map: map,
            title: title,
            icon: 'https://maps.google.com/mapfiles/ms/icons/green-dot.png',
            animation: google.maps.Animation.Bounce

        };

        marker = new google.maps.Marker(markerOptions);
        markers.push(marker); // add marker to array

        google.maps.event.addListener(marker, 'click', function () {
            // close window if not undefined
            if (infoWindow !== void 0) {
                infoWindow.close();
            }
            // create new window
            var infoWindowOptions = {
                content: content
            };
            infoWindow = new google.maps.InfoWindow(infoWindowOptions);
            infoWindow.open(map, marker);
        });
    }

    // show the map and place some markers
    initMap();

    setMarker(map, new google.maps.LatLng(attrs.latitude, attrs.longitude), attrs.restname, attrs.address);
    },true);
};

return {
    restrict: 'A',
    template: '<div id="gmaps"></div>',
    replace: true,
    link: link
};

指令（'myMap'，函数（）{ //定向链接功能 变量链接=函数（范围、元素、属性）{ 属性$观察（“纬度”，功能（纬度）{ //当数据更改时，将调用此函数。 var映射，信息窗口； var标记=[]； //地图配置 变量映射选项={ 中心：新的google.maps.LatLng（属性纬度，属性经度）， 缩放：12， mapTypeId:google.maps.mapTypeId.ROADMAP， 滚轮：错误 }; //初始化地图 函数initMap（）{ 如果（映射===void 0）{ map=new google.maps.map（元素[0]，mapOptions）； } } //放置标记 功能设置标记（地图、位置、标题、内容）{ var标记； 变量标记选项={ 职位:职位,， 地图：地图， 标题:标题,， 图标：'https://maps.google.com/mapfiles/ms/icons/green-dot.png', 动画：google.maps.animation.Bounce }; marker=新的google.maps.marker（markerOptions）； markers.push（marker）；//将marker添加到数组 google.maps.event.addListener（标记，'click'，函数（）{ //如果未定义，则关闭窗口 如果（信息窗口！==void 0）{ infoWindow.close（）； } //创建新窗口 var infoWindowOptions={ 内容：内容 }; infoWindow=newgoogle.maps.infoWindow（infoWindowOptions）； 信息窗口。打开（地图、标记）； }); } //显示地图并放置一些标记 initMap（）； setMarker（map，新的google.maps.LatLng（attrs.latitude，attrs.longitude），attrs.restname，attrs.address）； }，对）； }; 返回{ 限制：“A”， 模板：“”， 替换：正确， 链接：链接 }; }))

Html代码将是相同的。希望它能解决您的问题