$rootsScope.$watch not getting triggered

Question

I have a watch set in a service (code snippet below) and I cannot figure out why it is not getting triggered. The a similar watch set in a controller (using $Scope.$watch) IS getting triggered when the object changes.

What am I missing?

(function() {
    'use strict';
    angular
        .module('evidentia')
        .service('srcPaneSvc', SourcePaneSvc);

    SourcePaneSvc.$inject = ['$rootScope', '$timeout', 'dataProvider', 'dialogSvc', 'attachSvc'];

    function SourcePaneSvc($rootScope, $timeout, dp, ds, attachSvc) {

        var svc = this;
        svc.status =
        {
            isDirty : false,
            disabled : true,
            original : null
        };

        svc.attachSrc = attachSrc;
        svc.cloneSource = cloneSource;
        svc.deleteSource = deleteSource;
        svc.dirty = dirty;
        svc.editAttachment = editAttachment;
        svc.linkOriginal = linkOriginal;
        svc.newSource = newSource;
        svc.openAttach = openAttach;
        svc.openEditor = openEditor;
        svc.saveSource = saveSource;
        svc.showTemplates = showTemplates;
        svc.srcBox = openFSSrcBox;
        svc.openSrcDetail = openSrcDetail;
        svc.unattach = unattach;
        svc.unlink = unlink;

        $rootScope.$watch('dp.source', onSourceChange, true);

        function onSourceChange() {
            if (dp.source.id) {
...

This code DOES get triggered...

(function() {
    'use strict';
    angular
        .module('evidentia')
        .controller('rightSidebarCtrl', RightSidebarCtrl);

    RightSidebarCtrl.$inject = ['$scope', '$window', '$timeout', '$location', 'dataProvider', 'syncSvc'];

    function RightSidebarCtrl($scope, $window, $timeout, $location, dp, ss) {

        var vm = this;
        vm.online = false;
        vm.auth = ss.isAvailable();
        vm.srcMode = true;
        vm.srcFilter = '';
        vm.wrapStyle = (dp.GO.wrap ? {'white-space': 'normal'} : {'white-space': 'nowrap'});

        vm.collapse = collapse;
        vm.toggleSrc = toggleSrc;
        vm.subClick = subClick;
        vm.srcClick = srcClick;
        vm.refClick = refClick;

        $scope.$watch('dp.source', function () {
            _ev.dbg('RightSiderBarCtrl: source changed.');
...

score 1 · Accepted Answer · edited May 23 '17 at 12:12

1

To me it looks as if the variable you want to watch is not in an AngularJs scope and as far as I know it will not work in this case. See this question for an explanation.

What you need to do is trigger a digest cycle to get it to work.

EDIT:

Adding to the scope should solve the problem:

$rootScope.db = db;

edited May 23 '17 at 12:12

Community

1
1

answered Mar 14 '15 at 17:29

Sjoerd222888

3,228
3
31
64

The variable is injected ('dataProvider'/dp) so I am not sure what you mean about it not being in scope. As I pointed out, a similiar watch in a controller DOES get triggered... I'll add that code to the question – ed4becky Mar 14 '15 at 17:35
See my edit. An object is only part of an AngularJs scope if you assign it to the scope. Injecting it into the 'constructor-function' does not add it to the scope. – Sjoerd222888 Mar 14 '15 at 17:41
you were watching the $rootScope but db was not child object of the $rootScope object, so the watcher function would not see any changes. – Sjoerd222888 Mar 14 '15 at 17:51
I think I figured it out - 'dp' is added to the $scope of a controller at the body level, which is inherited all the way down the line. Since $rootScope is ABOVE that, it wasn't in $rootScope. Thasnks for the help! – ed4becky Mar 14 '15 at 17:51

$rootsScope.$watch not getting triggered

1 Answers1