メモ。AngularJSの$scopeをng-controllerの外から参照する方法。
angular.elementを使ってDOMをラップしたオブジェクトを取得し、scopeメソッドを呼ぶ。
AngularJS: API: angular.element
試したのはAngularJS 1.2.27。
test.html
<!DOCTYPE html> <html> <body> <button type="button" onclick="test()">test</button> <div ng-app="myApp"> <div ng-controller="myController" id="myElement"></div> </div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js"></script> <script> var myApp = angular.module('myApp', []); myApp.controller('myController', ['$scope', function($scope) { $scope.foo = "Hello!"; }]); function test() { var element = document.getElementById("myElement"); // jQueryかjqLiteが有効な場合はセレクタを使える // var $scope = angular.element('#myElement').scope() var $scope = angular.element(element).scope() alert($scope.foo); } </script> </body> </html>
testボタンをクリックすると「Hello!」という文字列が表示される。