2017-09-21 19 views
1

私はAngularJSに2つのコンポーネントを持っています。一方の成分usersListは、ページの読み込みでテーブル

<table> 
    <tbody> 
    <tr ng-repeat="..."><!--Contains code to repeat the entries in usersList localstorage object--></tr> 
    </tbody> 
</table> 

が含まれ、このコンポーネントは、APIと$のlocalStorageに保存するから、その詳細とユーザーのリストを取得します。その他 は、値が、私は、ユーザーの詳細を編集し、APIへの呼び出しを行うことで、ユーザーを削除しています編集し、したがって、基本的

app.component("editUserProfile", { 
    ... 
    controller: function($localStorage, ...) { 
    vm.$storage = $localStorage; 
    // Do other things 
    // Some event (edit) is successful, update the userslist in $localStorage 
    vm.$storage.usersList = response 
    } 
}) 

を削除されたフォーム editUserProfileあり、そして成功した編集/起き削除すると、私はリフレッシュJSONオブジェクトであるusersListの$ localStorage値。

データは完全に更新されますが、変更はusersListコンポーネントに反映されません。私はデータを表示するだけの呼び出しをAPIに保存するためにこれをやっています。他のアイデアは大歓迎です。

+0

$ storageと$ localstorageは何ですか? – Zooly

+0

私はngStorageを使用しています。 $ storageと$ localStorageはngStorageに関連しています。 –

+0

それを言及することを忘れないでください:) – Zooly

答えて

1

これを参照してくださいPlunkrを参照してください。

var app = angular.module('app', ['ngStorage']); 

app.controller('mainCtrl', function($scope, $localStorage){ 
    $scope.$storage = $localStorage; 

    $scope.$storage.entity = []; 

    $scope.add = function(){ 
    $scope.$storage.entity.push('New entry'); 
    } 

}); 

$localStorage$scopeに渡されるべきであると思われます。

$ scopeの下にあるフックへの参照によって$ localStorage(または$ sessionStorage)を渡します。

あなたの問題にはvm.$storageアサインメントが付いている場合があります。

+0

これは動作します!しかし、この問題は、ngStorageの値に$ watchを使用することで解決しました。つまりusersList –

関連する問題