Question

我有一个简单的Angular / Ionic应用程序，我试图在两个控制器之间共享布尔变量的状态，因此应用程序中显示的不同消息取决于变量是真还是假。目前，其中一个控制器最初只读取该值，并且在更改时不会更新。

以下是负责更改变量状态的控制器：

.controller('SettingsCtrl', function($scope, Settings) {

  $scope.notifications = Settings.notifications;

  $scope.toggle = function() {
    if (Settings.notifications == false) Settings.switchOnNotifications();
    else Settings.switchOffNotifications();
    $scope.notifications = Settings.notifications;
  };
})

这是辅助控制器，它只读取变量的状态：

.controller('HomeCtrl', function($scope, Settings) {
  $scope.notifications = Settings.notifications;
})

以下是存储变量的服务：

.factory('Settings', function() {

  var o = { notifications: false };

  o.switchOnNotifications = function() {
    o.notifications = true;
  };

  o.switchOffNotifications = function() {
    o.notifications = false;
  };

  return o;
})

以下是我试图更新的html，因为变量已更改：

<div ng-hide='notifications'>
  Switch on visit notifications
 </div>

 <div ng-show='notifications'>
   You are due at the gym in:
 </div>

可能是非常简单的事情，任何帮助都会受到赞赏。

Answer 1

当控制器实例化时，您将notifications标志从服务复制到范围中。因此，如果在复制完成后修改了该标志，则$scope.notifications变量仍然引用复制时的值。

最简单的解决方法是避免首先复制，并始终引用存储在服务中的一个真值：

.controller('HomeCtrl', function($scope, Settings) {
    $scope.settings = Settings;
})

和

<div ng-hide='settings.notifications'>
   Switch on visit notifications
</div>

<div ng-show='settings.notifications'>
   You are due at the gym in:
</div>

跨控制器共享服务变量;角/离子

1 个答案: