2014-05-11 3 views
0

"맵"태그에 "마커"태그가 있어야합니다.angular.js 중첩 된 지시어 범위 범위 속성

내 문제는 "마커"속성을 "지도"부모 범위의 변수를 사용하여 설정하고 싶습니다.

나는이 할 경우 :

<map center="{{userPosition}}"> 
     <marker lat="13.555232324" lng="43.555232324" text="Text1" on-click="callback('id_0')" ></marker> 
    </map>  

내 코드가 작동하지만이 같은 것을 할 싶습니다 : 지금 난 그냥 문자열로 "위도"읽을 수

<map center="{{userPosition}}"> 
     <marker lat="{{nearRooms['id_0'].lat}}" lng="{{nearRooms['id_0'].lng}}" text="Text1" on-click="callback('id_0')" ></marker> 
    </map>  

합니다.

내지도 지침 :

ngBMap.directive('map', [ function ($compile){ 
return { 
    restrict: 'E', 
    controller: ['$scope', function($scope) { 
    this.markers = []; 
    $scope.markers = []; 
    this.mapHtmlEl = null 
    this.map = null; 

    this.exeFunc = function(func, context, args){ 
     $scope.$parent[func].apply(context, args) 
    } 
    this.initializeMarkers = function(){ 
     for (var i=0; i<this.markers.length; i++) { 
      var marker = this.markers[i]; 
      this.map.entities.push(marker);   
     } 
    } 
    this.initializeMap = function(scope, elem, attrs){ 
      var map_canvas = document.createElement('div') 
      var _thisCtrl = this; 
      .... 
     this.mapHtmlEl = map_canvas;  
    } 
    this.setCenter = function(position){ 
     var position = eval(position) 
     var _position = new Microsoft.Maps.Location(position[0], position[1]) 
     if(this.map) 
      this.map.setView({center : _position}); 
    } 
    }], 
    scope: { 
    'center': '@', 
    }, 
    link: function(scope, element, attrs, ctrl) { 
    scope.$watch('center', function(center) { 
     console.log('center: '+center) 
     if(center){ 
      ctrl.setCenter(center) 
     } 
     }, false); 
    ctrl.initializeMap(scope, element, attrs) 
    element.html(ctrl.mapHtmlEl) 
    } 
} 

}]);

내 마커 지시자 :

ngBMap.directive('marker', [ function ($compile){ 
return { 
    restrict: 'E', 
    require: '^map', 
    link: function(scope, element, attrs, mapController) { 
     console.log('marker init') 
     var getMarker = function() { 
      var lat = attrs.lat 
      ..... 
      var marker = _marker; 
      return marker; 
     }//end getMarker 
     var marker = getMarker(); 
     mapController.markers.push(marker); 
    } 
}}]); 
+0

'this.markers = $ scope.markers = [];'를 사용해 보셨습니까? – pocesar

답변

1

당신이 controllerAs을 지원하는 각도 버전을 사용하는 가정하면이 작업을 수행 할 수 있습니다

ngBMap.directive('marker', [ function ($compile){ 
    return { 
    restrict: 'E', 
    require: '^map', 
    controllerAs: 'marker', 
    link: function(scope, element, attrs, mapController) { 
     var lat = attrs.lat 
<map center="{{userPosition}}"> 
    <marker lat="{{marker.nearRooms['id_0'].lat}}" lng="{{marker.nearRooms['id_0'].lng}}" text="Text1" on-click="marker.callback('id_0')" ></marker> 
</map>  

는 각도 1.0.x로에서 작동하려면 scope:true을 사용하여 상위 지시문을 상속하는 하위 범위를 작성하여 서로 충돌하지 않도록해야합니다.

+0

테스트했지만 작동하지 않습니다. 내 각 버전은 ** 1.0.7 **입니다. –

+0

그러면 작동하지 않습니다. controllerAs는 1.2.0 (및 시험판 버전)에서 구현되었습니다. – pocesar

+0

감사합니다. 저는 각진 버전을 업데이트했으며 "controllerAs : 'marker',"를 사용했습니다. –