AngularJS 控制器如何在没有嵌套的情况下进行通信？

Angular 控制器之间的通信

在 AngularJS 中，促进控制器之间的通信通常是必要的。但是，当控制器未嵌套时，从一个控制器访问另一个控制器中的变量会带来挑战。

在没有继承的情况下传递变量

将第一个控制器 (Ctrl1) 作为使用 $scope 向第二个控制器 (Ctrl2) 传递参数，由于未定义的错误，Ctrl1 不可行。类似地，使用 Ctrl2.prototype = new Ctrl1(); 从 Ctrl1 继承属性到 Ctrl2;也是不成功。

解决方案：利用服务

要在控制器之间共享变量而不嵌套，有效的解决方案是创建一个服务并将其注入到所有相关控制器中。服务是一个 Angular 组件，可以注入到多个控制器或指令中以共享功能。

示例服务：

angular.module('myApp').service('sharedProperties', function() {
  var property = 'First';

  return {
    getProperty: function() {
      return property;
    },
    setProperty: function(value) {
      property = value;
    }
  };
});

在控制器中的用法：

function Ctrl1($scope, sharedProperties) {
  sharedProperties.setProperty('New First');
}

function Ctrl2($scope, sharedProperties) {
  $scope.prop2 = 'Second';
  $scope.both = sharedProperties.getProperty() + $scope.prop2;
}

通过将sharedProperties服务注入两个控制器都可以独立访问和修改共享数据。

绑定到共享值

除了访问共享值之外，还可以绑定到它们在控制器的范围内。要保留绑定引用，建议绑定到对象的属性而不是原始类型。

var property = { Property1: 'First' };

// Binded to a static copy in Ctrl1
$scope.prop11 = property.Property1;

// Binded to the shared value in Ctrl2
$scope.prop12 = sharedProperties.getProperty().Property1;

以上是AngularJS 控制器如何在没有嵌套的情况下进行通信？的详细内容。更多信息请关注PHP中文网其他相关文章！