不能调用角度控制器的内部功能

时间:2016-01-10 23:36:32

标签: javascript angularjs

我想调用角度控制器的内部函数。

的index.html

<script type="text/javascript">
        $(document).ready(function() {
            $('#example').multiselect({
                onChange: function(option, checked, select) {
                    //alert('Changed option ' + $(option).val() + '.');
                    var scope = angular.element(document.getElementById("MainWrap")).scope();

                    var n = $(option).val();

                    scope.$apply(function () {createMarker(data[n-1]);});             

                }
            });
        });
    </script>

controller.js

var mapApp = angular.module('mapApp', []);

mapApp.controller('mapContainer',function($scope){

    var mapOptions = {
        zoom: 10,
        center: new google.maps.LatLng(12,77),
        mapTypeId: google.maps.MapTypeId.TERRAIN
    }

    $scope.map = new google.maps.Map(document.getElementById('map'), mapOptions);

    $scope.markers = [];
    var createMarker = function (info){

        var marker = new google.maps.Marker({
            map: $scope.map,
            position: new google.maps.LatLng(info.lat, info.long),
            name: info.name
        });
        $scope.markers.push(marker);

    };

});

我能够控制 mapApp.controller 中的日志数据,但是当调用 createMarker 时,显示错误:createMarker未定义错误。 按照此示例公开控制器http://jsfiddle.net/austinnoronha/nukRe/light/

1 个答案:

答案 0 :(得分:1)

只有在$ scope上公开时,该函数才可调用。

$scope.createMarker = function (info){
    var marker = new google.maps.Marker({
        map: $scope.map,
        position: new google.maps.LatLng(info.lat, info.long),
        name: info.name
    });
    $scope.markers.push(marker);
};

在模板中,您还需要通过控制器范围访问它:

scope.$apply(function () {scope.createMarker(data[n-1]);}); 

这假定您要检索的范围对象与mapContainer的范围相关。

值得注意的是,这是一种非常有棱角的做事方式。正确的方法是创建一个指令驱动的组件。