角度の異なるコントローラからの変数の監視

Question

サービスから別のコントローラの変数をどのように見ることができるのだろうかと思っていました。私は2つのコントローラと1つのサービスを持っています。コントローラ1が行う変数の変更は、サービス内の変数に変更がある場合、コントローラ2が時々チェックする必要のあるサービスに配置されます。しかし、私はそれを適切に見ることができません。ここに私のコードです。

コントローラ1

app.controller('ChooseFleetController',function($scope,shareDataService){         
    $scope.$watch('ItineraryDetails', function(newValue, oldValue){ 
     shareDataService.setData(newValue); 
    }, true); 
} 

コントローラ2

app.controller('ItineraryReservationController',function($scope,shareDataService){ 
    $scope.$watch(function() { 
     return shareDataService.ItineraryDetails; 
    }, function (newVal) { 
     console.log(newVal); 
    }); 
}); 

あなたはshared serviceを使用して直接objectを試すことができます

app.service('shareDataService', function() { 
var ItineraryDetails = {}; 

var setData = function(data) { 
    ItineraryDetails = data; 
} 

var getData = function (data) { 
    return ItineraryDetails; 
} 

return { 
    setData: setData, 
    getData: getData 
}; 
}); 

Answer 1

ItineraryDetailsshareDataServiceのプライベート変数です。ウォッチャーはgetData関数を実行する必要があります。

app.controller('AppController2',function($scope,shareDataService){ 
    $scope.$watch(function() { 
     //return shareDataService.ItineraryDetails; 
     return shareDataService.getData(); 
    }, function (newVal) { 
     console.log(newVal); 
    }); 
}); 

Answer 2

サービス：

user: any = { 
    "name": '', 
    "role": '', 
    "isActive": false 
} 

一度変更されると、両方の場所が反映されます（コントローラ）。

しかし、あなたはページをリロードする場合、変更は再び共有サービスで定義されたどのようなものを、デフォルトになります。

また、localstoreはあなたの要件を満たすことができます。

希望すると、これが役立ちます。

Answer 3

angular.module('starter.services',[]) 
    .factory('shareDataService',function(){ 
     var ItineraryDetails = {}; 

     var setData = function(data) { 
     ItineraryDetails = data; 
    } 

    var getData = function (data) { 
     return ItineraryDetails; 
    } 

    return { 
     setData: setData, 
     getData: getData 
    }; 
}) 

Answer 4

別の解決策は、この問題のために、私が知っているのサービスと$範囲で$ rootScope。$放送を使用することです。コントローラで$上。

SERVICE

app.service('shareDataService', function($rootScope) { 

    var ItineraryDetails = {}; 


    var setData = function(data) { 
     ItineraryDetails = data; 
     this.$rootScope.$broadcast('itinerary-change', data); 
    } 

    var getData = function (data) { 
     return ItineraryDetails; 
    } 

    return { 
     setData: setData, 
     getData: getData 
    }; 
}); 

CTRL-1

app.controller('ChooseFleetController',function($scope,shareDataService){ 
    $scope.$on('itinerary-change', function(event, data){ 
      console.log(data); 
      $scope.$apply(); //if you need to apply change to view immediately 
    }); 
}); 

CTRL-2あなたたちはその解決策について考える何

app.controller('ItineraryReservationController',function($scope,shareDataService){ 
     $scope.$on('itinerary-change', function(event, data){ 
       console.log(data); 
       $scope.$apply(); //if you need to apply change to view immediately 
     }); 
    }); 

：ここではどのようなコードを見てのようなものですか？