控制器和服務之間的事件處理範圍

Question

我的控制器在其範圍內聲明一個變量。我希望這個變量可以在$ rootScope。$內部訪問，但似乎並非如此。這是我的問題。

---

這是我的控制器：

app.controller('MainCtrl', function($rootScope, OnTest) { 
    $scope.variable = null; 

    $rootScope.$on('eventCalled', function() { 
     if ($scope.variable == null) { 
      alert("THIS IS MY ISSUE: SHOULD NOT BE NULL"); 
     } 
    }); 

    $scope.methodCalledFromTheView = function() { 
     $scope.variable = {age: 23}; 
     TestApp.method1(); 
    } 
}); 

---

這是我的服務：

app.service('TestApp', function ($rootScope) { 
    this.method1 = function() { 
     $rootScope.$emit("eventCalled"); 
    } 
}); 

輸出：

「這是我的問題：不應爲null」

我應該改變，以確保$ scope.variable爲$ rootScope內可達$上？

Answer 1

這是更多基於事件的雙向綁定更新的解決方案。此外，以$emit的工作方式，它只將事件發送到$ rootScope，而不是所有的子項。 $ broadcast更適合應用於控制器或指令（嵌套在DOM中的任何東西），而$ emit對於服務更好，因爲通常服務不會創建隔離範圍。

// CONTROLLERS SHOULD NOT ACCESS $ROOTSCOPE, BUT USE THEIR OWN $SCOPE 
app.controller('MainCtrl', function($scope, TestApp) { 
    $scope.variable = null; 

    TestApp.broadcastEventCalled(); 

    TestApp.onEventCalled($scope, function() { 
     $scope.variable = {age: 23}; 
     if ($scope.variable == null) { 
      alert("THIS IS MY ISSUE: SHOULD NOT BE NULL"); 
     } 
    }); 
}); 
//SERVICE SHOULD ONLY HAVE EVENT THROWERS AND $ROOTSCOPE 
app.service('TestApp', function ($rootScope) { 
    this.broadcastEventCalled = function() { 
     $rootScope.$broadcast("eventCalled"); 
    }; 

    this.onEventCalled = function (scope, callback) { 
     return scope.$on('eventCalled', function() { 
     callback(); 
     }); 
    }; 
}); 

希望它有幫助！