第一次更改后无法使用工厂在控制器之间共享数据答案

【问题标题】：Can't share data between controllers using factory after first time change第一次更改后无法使用工厂在控制器之间共享数据
【发布时间】：2015-09-18 18:02:04
【问题描述】：

我知道 angularjs 有两种方式的数据绑定。我有两个想要互相交谈的控制器。我使用工厂让他们相互交流。在AppCtrl 控制器中，我将Data.mydata.buildingName 分配给一个名称。这就是我正在做的事情：

调用AppCtrl，修改buildingName的值。

然后当我调用PathController时，它知道buildingName的值发生了变化并显示出来。

但是当我回到AppCtrl，并再次更改buildingName 的值时，PathController 似乎并不知道这一点。

谁能告诉我我在这里做错了什么？

// 工厂

.factory('Data', function(){
    return { 
       mydata: {
           buildingName: 'Campus',
           shortName: 'Main',
           lattitude: '35.720031000963',
           longittude: '-87.343068987131'
       }
    };
})

// 控制器一

.controller('AppCtrl', function($scope, Data, $http, $ionicModal, $timeout) {

    // map location
    $scope.mapLocation = function(name, shortName, lattitude, longittude) {
        Data.mydata.buildingName= name;
        Data.mydata.shortName= shortName;
        Data.mydata.lattitude= lattitude;
        Data.mydata.longittude = longittude
        $scope.Data = Data.mydata;

        console.log("From AppCtrl: " +  Data.mydata.buildingName+ "  "+ Data.mydata.shortName+"  "+ Data.mydata.lattitude + " "+ Data.mydata.longittude );
        $scope.modal.hide();
    }
})

// 控制器二

.controller("PathController", [ '$scope', 'Data', function($scope, Data) {

    $scope.Data = Data.mydata.buildingName;

    var name = Data.mydata.buildingName + " - " + Data.mydata.shortName;
    lattitude = Data.mydata.lattitude;
    longitude = Data.mydata.longittude;

    angular.extend($scope, {
        center: {
            lat: 35.720031000963,
            lng: -87.343068987131,
            zoom: 17
        },

        markers: {
           Campus: {
               lat: longitude,
               lng: lattitude,
               focus: true,
               draggable: false,
               message: name
           }, 
        },
    });
}])

【问题讨论】：

mapLocation () 是从哪里调用的？如果发生在 Angular 之外的事件中，则需要通知 Angular 范围的更改
@charlietfl 地图位置是通过 HTML 中的 onClick 调用的。 ( ) 我如何将 Angular 范围的更改通知给工厂？

标签： javascript angularjs angularjs-directive angularjs-scope

【解决方案1】：

在您的PathController、$scope.Data、lattitude、longittude 和name 中只是字符串值。更改Data.mydata 的属性不会影响它们。

观察值的变化并相应地更新控制器值的一种方法是使用$scope.$watch()：

// add at the end of PathController
$scope.$watch(function () {
    return Data.mydata;
}, function (newValue) {
    $scope.Data = newValue.buildingName;
    $scope.markers.Campus.lat = newValue.lattitude;
    $scope.markers.Campus.long = newValue.longittude;
    $scope.markers.Campus.message = newValue.buildingName + " - " + newValue.shortName;
}, true /* check for object equality */);

【讨论】：