AngularJS-将新记录添加到集合/db后刷新列表

在db/collection-

storage.set（）方法中添加新记录时，如何更新/刷新我的
$scope.list
-请参阅代码中的注释

请参阅下面的代码

angular.module("app", [])

.factory('Storage', function() {

    var storage =  {};
    storage.get = function() {
        return GetStuffHere();
    }
    storage.set = function(obj) {
        return SetStuffHere(obj);
    }
    return storage;
})
.controller("MainCtrl", function($scope, Storage) {

    $scope.addStuff = function(){

        var obj = {
            "key1" : "data1",
            "key2" : "data2"
        };
        Storage.set(obj);
       // update $scope.list here, after adding new record
    }
    $scope.list = Storage.get();

});

你必须使用

$scope.list = Storage.get;

在模板中，您可以使用

<ul>
  <li ng-repeat="item in list()">{{whateverYouWant}}</li>
</ul>


{{{whateverYouWant}


使用这种方法，您将始终保持当前的存储状态。下面的解决方案将在作用域上运行。但是，我不确定将其放在函数中并在需要时调用（在
MainCtrl
中）是否是最佳做法：

i、 e:


首次装载
然后在添加新项目之后

.controller("MainCtrl", function($scope, Storage) {

$scope.addStuff = function(){

    var obj = {
        "key1" : "data1",
        "key2" : "data2"
    };

    Storage.set(obj);

    // rebuild $scope.list after new record added
    $scope.readList();

}

// function to bind data from factory to a $scope.item
$scope.readList = function(){
    $scope.list = Storage.get();
}

// on first load
$scope.readList();

});


无法

return SetStuffHere(obj)

还需要返回更新的列表吗？并指定：

$scope.list = Storage.set(obj);

如果这是返回单个插入项的API端点，则可以将其推送到$scope.list对象

但也许我遗漏了您正在尝试做的事情…
更新后端/工厂内容是通过调用set/post服务完成的基本角度绑定。但是，如果要根据工厂中发生的更改自动刷新控制器变量（$scope.list），则需要创建一个类似池的函数，并执行以下操作：

.run(function(Check) {});

.factory('Storage', function() {

     var storage =  {};

     var Check = function(){
           storage = GetStuffHere();
           $timeout(Check, 2000);
     }

    // set...

    Check();
    return storage;

 })

 .controller("MainCtrl", function($scope, Storage) {

     $scope.list = Storage.storage;

您想做什么还不是100%清楚，但假设存储只在用户更新时更新（即，不同位置的两个用户不可能更改相同的
内容），那么您的方法应该是：


完成后，从存储服务返回包含新存储对象的承诺，并在完成后使用
.then（function（）{…}）
设置
$scope.list

如果存储服务以某种方式改变了需要在前端反映的信息（例如，用于处理未来交互的
id
被添加到对象中），您可能希望采用这种方法注意默认情况下，
$http
调用返回一个承诺，因此如果您使用web服务进行存储，这不会有太多额外的代码

使用
$scope.list.push（obj）


如果服务器端的某些内容在没有来自特定客户端的输入的情况下发生了更改，那么我将研究使用websocket（可能使用socket.io）使其保持最新状态。
以下是一种将接收到的数据作为阵列存储在服务中的方法。它使用服务中的承诺发送以前存储的数组（如果存在），或者发出HTTP请求并存储响应。使用$http的承诺，它返回新存储的数组

这现在允许在其他控制器或指令之间共享存储的阵列。添加、编辑或删除时，现在在服务中存储的阵列上完成

app.controller('MainCtrl',function($scope, Storage){
  Storage.get(function(data){
    $scope.items=data
  });

  $scope.addItem=function(){
    Storage.set({name: 'Sue'});
  }
})

app.factory('Storage', function($q,$http) {

    var storage =  {};
    storage.get = function(callback) {
      /* see if already cached */
      if( ! storage.storedData){
        /* if not, get data from sever*/
        return $http.get('data.json').then(function(res){
          /* create the array in Storage that will be shared across app*/
          storage.storedData=res.data;
          /* return local array*/
          return storage.storedData
        }).then(callback)
      }else{
        /* is in cache so return the cached version*/
        var def= $q.defer();
        def.done(callback);
        defer.resolve(storage.storedData);
        return def.promise;
      }


    }
    storage.set = function(obj) {
     /* do ajax update and on success*/
        storage.storedData.push(obj);
    }
    return storage;
})

您不能只添加
$scope.list=Storage.get（）在
设置之后
？@Beterraba-但这不会将更新的值分配给$scope.list。可以再次执行
$scope.list=Storage.get（），但我可以想象有一些更好的方法，因此我的问题。@charlietfl请查看下面我的答案，如果看到您的解决方案采用异步计数将非常有用。
。get（）
setstufhere（）
将返回新创建的对象，因此，将这个新项目推到$scope将是比再次获取所有数据更好的解决方案。谢谢你的建议！基本上，这会每2秒检查一次？只需执行
$scope.list.push（Storage.set（obj））addStuff（）中的code>
？假设
Storage.set（obj）
不是异步的，
Storage.set（obj）
将返回新创建的记录`这看起来是一种非常低效的方法。不幸的是，我不知道任何其他“绑定”资源的方法，直到今天->参见charlietfl post。他玩弄诺言，这是有效的！也许我遗漏了一些东西，但我的理解是带有控制器（或范围）的角度双绑定视图。但是没有将范围与工厂/资源绑定。你是对的，它没有与工厂或资源绑定，但这是因为没有一种真正的方法可以做到这一点。在许多情况下，用户自己会导致服务的数据更新，因此这通常是更新范围（如果尚未更新）的好地方。或者，他们提供
$watch
绑定到工厂属性或方法（如果需要）。您只需小心不要做得太多-例如，
$watch
一个进行http调用的函数不是一个好主意。我们的
是什么？然后（回调）
？它是
Storage.get（函数（数据）{$scope.items=data}）-不知道你可以这样使用它。我将更新我的代码以使用Promissions。顺便说一句，我应该在
storage.set（）上等待AJAX成功吗
或直接推到
存储数据
？我会…如果失败，用户会看到与服务器上不同的数据，并且不知道更新失败…可以使用其他方法，但需要一些东西来处理失败的httpwait…如果查看我在存储集中所做的评论…并在那里发出请求。这样服务就可以处理所有请求，而不需要将它们放在控制器中感谢您花一分钟的时间对此进行评论。在这个给定的示例中，我们将假设只有一个用户（即忽略每个用户的存储/集）——正如您所说的，使用承诺和回调看起来是最好的方法。谢谢你的意见。