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中文網其他相關文章！