1

$http.get を使用して、コントローラーで json ファイルを取得する必要があります。

module.controller 'SampleMapController', ($http, $scope) ->
    $http.get('../../highcharts/mapdata/world.geo.json').
        success (data) ->
            $scope.mapData = data # works and logs out correctly

そして、それをディレクティブに渡します。ディレクティブは、マッピングの目的でその json を使用します。

module.directive 'MapDirective', () ->
    require: '?SampleMapController'
    templateUrl: '../template.html'
    link: ($scope) ->
        console.log $scope.mapData # undefined
        $scope.$watch 'an.object.that.contains.more.data',
            (newValue) ->
                chart = new Highcharts.Chart({
                    chart: {
                        renderTo: 'container div'
                    }
                    # ... use $scope.mapData somewhere in here to render the global map
                })
            true

しかし、私はその $scope にアクセスする運がなく、$rootScope に配置する必要があるのか​​ 、それともイベントがコントローラーを必要とするのかわかりません。

の内部で高チャート マップを生成しています。link:

私が探しているものの詳細な説明は、抽象化されたJSBinにあります。

4

2 に答える 2

1

ディレクティブに $scope を注入することはできません。代わりに、ディレクティブのリンク関数にスコープを渡すことができます

      your should use this : 


      link:function(scope,element,attributes){ // Notice to the function scope

         // Now you have access to the scope , and you can do whaterver you want .

       }

注 依存性注入の哲学では、コントローラーでは $scope を依存性として注入でき、$記号は angularJS で知られています。また、コントローラーでの依存性注入は任意の順序に従わないということです。つまり、これを考慮してください。

  app.controller('YouController',function($scope,$location,$http,...){
       // You see in the injection , I injected $scope first , but it doesn't matter , I mean I can inject $location first , and then $scope , and ...
      // So there is no order here !

     // your stuff here
  });

ただし、ディレクティブでは、リンク関数に依存関係を渡す順序が重要ですが、名前は重要ではありません。

  app.directive('yourdirective',function(){// you cannot inject $scope here !
      return {

          link : function(scope,element,attributes){// order is important
               // anything that comes first , is scope 
               // Second is always element 
               // Third is always attributes 
               // So you could do this : 
               // function(scooooope,elem,att)
               // See I changed the names , because here names are not important , but the order is important
             }
        }
      });

編集:コードをクリアしました::(

   module.directive('MapDirective',function(){
    return{
       require: '?SampleMapController'
       templateUrl: '../template.html'
       link: function(scope){
           console.log scope.mapData 
         // Please test , if still undefiend ;
       }
      }
   })
于 2014-06-20T23:09:31.907 に答える