JSON 解析不适用于 ng-repeat

Question

所以我正在使用 Ionic、angular 和 ngCordova。我正在尝试加载一个 JSON 文件，该文件是我通过对象数组的 JSON.stringify() 保存的。我有一个保存这个对象数组的工厂，基本上我有一个主页路由，通过该数组 ng-repeats 来显示对象。

加载工作正常，理论上解析器也是如此；我的 html 看起来像这样：

<ion-content ng-controller="HomePageControl">
{{posts}}
<ul class="list" ng-repeat="post in posts | limitTo:25">
  <a nav-direction="forward" class="item" ui-sref="entry({postID:$index})">
    {{post.text}}
  </a>
</ul>
<button class="button" ng-click="update()">Update</button>

所以 "posts" 是我的 $scope.posts 对象；你可以看到我在列表之前和列表期间加载它（我正在处理 Android，这基本上是我可以调试的唯一方法）。我还有一个按钮 "updates"（重新加载 json 并将帖子设置为与工厂中的帖子相同）数据。

我的主页控件如下所示：

.controller('HomePageControl', function($scope, postsFactory){
postsFactory.updatePosts();
  $scope.posts=[];
  postsFactory.readPosts().then(function(data) {
    $scope.posts = postsFactory.getPosts();
  })
  $scope.update=function(){
    postsFactory.updatePosts();
    $scope.posts= postsFactory.getPosts();
  }


})

所以，这里的问题是 {{posts}} 吐出正确的解析对象，看起来像这样，除了文本：

[{"text":"mreow"},{"text":"text"},{"text":"WORK"}]

但是 ng-repeat 没有做任何事情。它只是空白。但是，当我按几次“更新”按钮时，它会出现列表，但文本没有任何变化。 postsFactory 中的代码也基本相同。

posts工厂：

.factory('postsFactory', function($cordovaFile,$ionicPlatform,$ionicPopup){
  var posts = [];
  var factory = {};
  factory.getPosts=function(){
    return posts;
  }
  factory.readPosts=function(){
      return $ionicPlatform.ready(function(){}).then(function(first){
        return $cordovaFile.readAsText(cordova.file.externalDataDirectory, "posts.json");
      }, function(error){
        return error + "not ready";
      }).then(function (second) {
          posts=JSON.parse(second);

         return posts;
      },function(error){
        return error + "Error reading";
      });
  }

  factory.updatePosts=function(){
    $ionicPlatform.ready(function() {
      $cordovaFile.readAsText(cordova.file.externalDataDirectory, "posts.json")
       .then(function (success) {
          posts=JSON.parse(success);
       }, function (error) {
         var alertPopup = $ionicPopup.alert({
            title: 'Error',
            template: 'Could not read file'
          });
       });
   });
  }
  return factory;
})

tldr；我的解析有效，但 ng-repeat 没有接受它。有什么想法吗？

Answer 1

当你处理异步方法时，它正在执行一些异步操作并将一个 promise 对象返回给消费者函数。基本上你需要放置 .then 服务方法调用的 getPosts 函数。因此，一旦数据从 getPosts 方法返回，它将调用 .then 的 success/error/catch 函数取决于 promise 对象 resolved/reject/error occured while processing request

postsFactory.getPosts().then(function(posts){
   $scope.posts = posts;
})

Answer 2

所以，经过一些进一步的实验，我找到了问题的根源：它没有正确读取 JSON，因为它没有被正确写入。我通过替换 JSON 文本找到了这一点，并且一切正常。因此，为了解决这个问题，我使用 angular.toJson(object) 方法代替了 JSON.stringify(object) 函数。

所以，对于那些有同样问题的人，我的保存脚本是这样的：

factory.newPost=function(post){
      posts.push(post);
      $ionicPlatform.ready(function() {
          $cordovaFile.writeFile(cordova.file.externalDataDirectory, "posts.json", angular.toJson(posts), true).then(function (success) {

          });
      });
    }

干杯

JSON 解析不适用于 ng-repeat

JSON parse doesn't work for ng-repeat

javascript

json

angularjs

ng-repeat

ionic-framework

JSON 解析不适​​用于 ng-repeat

JSON parse doesn't work for ng-repeat

javascript

json

angularjs

ng-repeat

ionic-framework

JSON 解析不适用于 ng-repeat