スクリプト現在

Question

内の角コントローラへのアクセス、私はこのコードは、角度指示内に含まれている。この

<div id="{{id}}" ng-controller="ngController as ngCtrl" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
     <!-- Modal content--> 
     <!-- Removed some non important html --> 
     <script src="/static/jstree/dist/jstree.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       $.getJSON("/book/modules", function(d) { 
        var moduleDiv = $("#module-div") 
        moduleDiv.jstree({ 
         core: { 
          data: d 
         } 
        }); 
        moduleDiv.on("select_node.jstree", function(e, data) { 
         ngCtrl.selectedModule = data; 
        }); 
       }); 
      }); 
     </script> 
    </div> 
</div> 

のようないくつかのコードを持っています。

app.directive("modulesModal", function(){ 
    return { 
     scope: { 
      label: "@", 
      input: "@", 
      ngController: "=", 
      id: "@" 
     }, 
     templateUrl: "/static/book_config/html/modules-modal.html", 
     link: function($scope, $elem, $attrs){ 
      // Non important stuff 
     } 
    }; 
}); 

それでは、私は本当にやろうとしているが、ここで

moduleDiv.on("select_node.jstree", function(e, data) { 
    ngCtrl.selectedModule = data; 
}); 

いくつかのコントローラ変数にアクセス私はちょうどディレクティブタグを介して、それを私のコントローラをプラグインすることができますこの方法です： 例：

<modules-modal id="myModal" ng-controller="newBookCtrl"></modules-modal> 

この問題を解決する正しい方法は何ですか？

Answer 1

jqueryとangularを結合する方法は、あなたがした角度指令を作成することです。ただし、jqueryコードを外部から実行してディレクティブに渡す代わりに、ディレクティブ内で移動する必要があります。この場合、ディレクティブコントローラを作成してから、コントローラ自体にjsonデータをロードすることができます。

app.directive("modulesModal", function(){ 
 
    return { 
 
     scope: { 
 
      label: "@", 
 
      input: "@", 
 
      //ngController: "=", <- you don't need to pass in a controller 
 
      id: "@" 
 
     }, 
 
     templateUrl: "/static/book_config/html/modules-modal.html", 
 
     link: function($scope, $elem, $attrs){ 
 
      // Non important stuff 
 
     }, 
 
     controller: function ($scope) { 
 
       $.getJSON("/book/modules", function(d) { 
 
       var moduleDiv = $("#module-div") 
 
       moduleDiv.jstree({ 
 
        core: { 
 
         data: d 
 
        } 
 
       }); 
 
       moduleDiv.on("select_node.jstree", function(e, data) { 
 
        $scope.selectedModule = data; 
 
       }); 
 
      }); 
 
     } 
 
    }; 
 
});

：それは、この（未テストコード）のようなものでなければなりません