1

私はこのように私の見解で ng-init を保持します:

                    <div class="map-content" style="min-height: 200px">
                        <div ng-init="data = {latitude : 35.757563, longitude: 51.409469}">
                            <div map-marker ng-model="data" class="demo-map"></div>
                        </div>
                    </div>

そして、ここに私のコントローラがあります:

app.controller('mapController' , function($scope) {})
    .directive('mapMarker',function(){
        return {
            restrict: 'EA',
            require: '?ngModel',
            scope:{
                myModel: '=ngModel'
            },
            link: function(scope , element, attrs , ngModel) {

                scope.mapData = {};
                scope.mapData.latitude = attrs.latitude;
                scope.mapData.longitude = attrs.longitude;
                console.debug(scope.myModel);
                var mapOptions;
                var googleMap;
                var searchMarker;
                var searchLatLng;

                ngModel.$render = function(){
                    searchLatLng = new google.maps.LatLng(scope.myModel.latitude, scope.myModel.longitude);

                    mapOptions = {
                        center: searchLatLng,
                        zoom: 12,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                    };

                    googleMap = new google.maps.Map(element[0],mapOptions);

                    searchMarker = new google.maps.Marker({
                        position: searchLatLng,
                        map: googleMap,
                        draggable: true
                    });

                    google.maps.event.addListener(searchMarker, 'dragend', function(){
                        scope.$apply(function(){
                            scope.myModel.latitude = searchMarker.getPosition().lat();
                            scope.myModel.longitude = searchMarker.getPosition().lng();
                        });
                    }.bind(this));

                };

                scope.$watch('myModel', function(value){
                    var myPosition = new google.maps.LatLng(scope.myModel.latitude, scope.myModel.longitude);
                    searchMarker.setPosition(myPosition);
                }, true);
            }
        }
    });

ng-init をコントローラーに送信したい。それについて何か考えはありますか？

4

2 に答える 2

0

非常に簡単です：

app
    .controller('mapController', function($scope) {
        $scope.data = {
            latitude: 35.757563,
            longitude: 51.409469
        };
    })
    .directive('mapMarker', function() {
        // ...
    });

もちろん、HTMLから削除します：

<div class="map-content" style="min-height: 200px">
    <div map-marker ng-model="data" class="demo-map"></div>
</div>
于 2016-07-16T09:50:01.220 に答える