AngularJSで外部からサービスを使う際、
$watch
,$broadcast
が動作しません。
どのようにしたら動作するでしょうか?
javascript
1var app = angular.module("myApp"); 2 3app.service("appService", ["$rootScope", function($scope) { 4 let msg = null; 5 6 $scope.$watch(() => msg, (value) => { 7 $scope.$broadcast("change:msg", value); 8 }); 9 10 $scope.$on("change:msg", (evt, value) => { 11 console.log(value); // 動く 12 }); 13 14 this.greet = function() { 15 msg = "hello world !"; 16 }; 17}]); 18 19app.controller("myController", ["$scope", "appService", function ($scope) { 20 $scope.$on("change:msg", (evt, value) => { 21 console.log(value); // 動かない 22 }); 23}]); 24 25function hoge() { 26 let $injector = angular.injector(["ng", "myApp"]); 27 $injector.invoke(["appService", function (appService) { 28 appService.greet(); 29 }]); 30}
hoge()
を呼び出した時にサービスのgreet()
が呼ばれるまでは確認しました。
msg
は変更されるのですが、$watchが動作しません。
greet()
内で$scope
が参照できるのも確認しました。
greet()
内で$scope.$broadcast("change:msg", msg);
としても$broadcast
も動作しませんでした。
追記
サービス内で$scope.$on
を利用すると動作しました。
別のコントローラーで$scope.$on
を利用すると動作しませんでした。
injectorから呼び出した際に$scopeがrootでないようですが、どうしたらrootに出来るのかが分かりません。
あなたの回答
tips
プレビュー