0

アプリのロード時に保存されるデータをモデルから取得する Angular アプリケーションがあります。簡単にするために、プルされるデータを明示的に定義しました。

私が抱えている問題は、私のコントローラーの 1 つで、モデルから引き出されたデータを変更するコントローラーのロード時に関数を実行していることです。ポイントは、そのコントローラーのみを使用しているそのページの追加データが必要だということです。そのデータをモデルに保存したくありません(これが起こっていることです)。

私のモデル:

'use strict';
(function () {
    var PotsMod = function ($log, _) {
        return {
            pots: [
                {"comp" : "comp1"},
                {"comp" : "comp2"}
            ],
            getPots: function () {
                return this.pots;
            },
        };
    };
    angular
        .module('picksApp.models')
        .factory('PotsMod', PotsMod);
})();

私のコントローラー：

(function () {
    function AdmCtrl($log, $routeParams, PotsMod) {
        var vm = this;
        vm.pots = PotsMod.getPots();
        vm.init = function() {
            // populate pot.competition
            _.forEach(vm.pots, function(pot) {
                pot.comp = "test";
            });
            console.log(PotsMod.getPots());
        }
        vm.init();
    }
    angular
        .module('picksApp.controllers')
        .controller('AdmCtrl', AdmCtrl);
})();

vm.init() の最後の行である PotsMod.getPots() は、「comp」の値をテストとして、更新されたモデルを返します。

だから私は代わりにこれを試しました - 私は次のように vm.pots の下にデバッグ行を置きました:

    var vm = this;
    vm.pots = PotsMod.getPots();
    console.log(vm.pots);
    vm.init = function() {....

これは、オブジェクト値がテストされている配列も返します...

そこで、最後のことを 1 つ試し、vm.init() 関数にも追加のデバッグ行を追加しました。

    var vm = this;
    vm.pots = PotsMod.getPots();
    console.log(vm.pots);
    vm.init = function() {
        // populate pot.competition
        _.forEach(vm.pots, function(pot) {
            console.log(pot.comp);
            pot.comp = "test";
        });
        console.log(PotsMod.getPots());
    }
    vm.init();

この結果は私を混乱させます...コンソールの出力は次のとおりです。

[{"comp":"test"},{"comp","test"}]
comp1
comp2
[{"comp":"test"},{"comp","test"}]

モデルの値を使用して変数を定義し、その変数を更新された値で出力し、古い値を使用してそれらを出力し、モデルから更新された値を再度出力する方法がわからないため、ここで何かが欠けているに違いありません(このコードでは何もモデルに触れていませんが)。

どこかで根本的な間違いを犯しているようです。ありがとうございました。

4

1 に答える 1

1

コントローラーでサービスの pots オブジェクトを参照しているため、コントローラーのコードもサービスのコードを変更しています。

angular.copy() がサービスの「ポット」のディープ コピーを作成する方法を示すために Plunker を作成したため、コントローラーのモデルは元のモデルを参照しなくなりました。

あなたの場合、変更する必要があるのはvm.pots = angular.copy(getPots());

http://plnkr.co/edit/jg5mWIWds1KMJd51e3o5?p=preview

于 2016-01-12T17:11:27.993 に答える