関連のない AngularJS コントローラー間で変数を効果的に共有するにはどうすればよいですか?

AngularJS コントローラー間での変数の受け渡し

AngularJS では、特にコントローラーがネストされていない場合、コントローラー間のデータ フローの管理が困難になることがあります。コントローラー間で変数共有を実現する方法は次のとおりです。

サービスの使用

サービスは、コンポーネント間でデータを共有する強力な方法です。サービスを作成し、共有変数にアクセスする必要があるコントローラーにそれを挿入します:

angular.module('myApp')
    .service('sharedProperties', function () {
        var property1 = 'First';
        
        return {
            getProperty1: function () {
                return property1;
            },
            setProperty1: function(value) {
                property1 = value;
            }
        };
    });

コントローラーで、サービスを挿入し、そのメソッドを使用して共有変数にアクセスして変更します:

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

共有値へのバインド

共有値のリアルタイム更新用コントローラー間で、プリミティブ型の代わりにオブジェクトのプロパティにバインドできます:

angular.module('myApp')
    .service('sharedProperties', function () {
        return {
            property1: { Property1: 'First' }
        };
    });

コントローラーでは、プリミティブ値の代わりにオブジェクトのプロパティにバインドします:

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

ヒント:

• オブジェクトのプロパティにバインドするときは、オブジェクトがデータ バインディングをトリガーするためにそれ自体が更新されます。
• 未定義の参照が発生する可能性があるため、あるコントローラーから別のコントローラーへ共有変数に直接アクセスすることは避けてください。
• サービスは、データ共有を管理するための構造化された効率的な方法を提供します。そして分離された設計を強制します。

以上が関連のない AngularJS コントローラー間で変数を効果的に共有するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。