1

他のスコープ変数に依存するスコープ変数を持つディレクティブがあります。方程式の右側のスコープ変数が変更された場合、左側が更新されると予想されますが、これは起こっていないようです。

以下の例では、selectProduct() を実行すると、製品タイトルを含む製品情報が更新されるはずですが、関数の下部にあるコメント行のように scope.title を直接更新しないと機能しません。

controller:function($scope){
        $scope.products = $scope.productGroup.products;

        $scope.selected_product = $scope.productGroup.products[$scope.productGroup.selected_product];
        $scope.title = _.isEmpty($scope.selected_product) ? $scope.productGroup.title : $scope.selected_product.title;
        $scope.excerpt = _.isEmpty($scope.selected_product) ? $scope.productGroup.excerpt : $scope.selected_product.excerpt;
        $scope.description = _.isEmpty($scope.selected_product) ? $scope.productGroup.description : $scope.selected_product.description;

        $scope.selectProduct = function(){
            $scope.selected_product = $scope.productGroup.products[1];
            console.log($scope.selected_product);
            //$scope.title = $scope.selected_product.title;
        }
    },
4

1 に答える 1

1

テンプレートでは、 に設定してバインドする{{ selected_product.title }}代わりに、バインドするだけです。$scope.title = $scope.selected_product.title{{ title }}

経験則$scopeとして、 をモデルとして誤用しないでください。あなたのViewModelでさえありません。JavaScript のプロトタイプの継承と変数参照システムにより、Angular は ViewModel である従来の MVVM パターンに実際には従わないように$scopeなります。

あなたの問題の実例がなければ、暗闇の中でショットを試して、コードをそのようなものにリファクタリングすることをお勧めします。

controller:function($scope){
    $scope.products = $scope.productGroup.products;
    $scope.selected_product = $scope.products[$scope.productGroup.selected_product] || {
        title: $scope.productGroup.title,
        excerpt: $scope.productGroup.excerpt,
        description: $scope.productGroup.description
    };

    $scope.selectProduct = function(){
        $scope.selected_product = $scope.productGroup.products[1];
    }
},

詳細な背景情報については、必ずこれをお読みください。

AngularJS のスコープ プロトタイプ/プロトタイプ継承のニュアンスは何ですか?

あなたの問題は、実際にはプロトタイプの継承に正確に関連しているようには見えませんが、それでも必ず読んで理解してください。私が見る限り、あなたのコードでは、実際の問題は、一度設定してから、変更に応じて自動的$scope.titleに変更されることを期待していることですが、なぜそうすべきなのでしょうか? $scope.selected_productこの 2 つの間に魔法のようなつながりはありません。ただし、コードを私が提供したものにリファクタリングすると、バインディングが機能するだけでなく、重複_.isEmpty()チェックが少なくなるというメリットもあります (そもそも実際に必要だとは思いません;-))

于 2013-09-28T22:37:26.920 に答える