如何在 HTML 页面中显示存储在本地存储中的 json 字符串中的 json 数据

Question

我有从 laravel 返回的数据，格式如下。我将其存储在本地存储中，供用户登录后使用。

我在前端使用 angular，这就是我存储它的方式

$http.get($scope.url).success(function(redata){
    localStorage.setItem('session', JSON.stringify(redata));
    $scope.fulldata = JSON.parse(localStorage.getItem("session"));
});

这是json数据

{
"tweets":[
    {"id":"3","uid":"15","tweets":"Molly's first tweet"},
    {"id":"4","uid":"15","tweets":"molly again here, second tweet"},
    {"id":"5","uid":"15","tweets":"third tweet"}
   ],

"users":[
    {"id":"1","name":"rob","email":"rob@gmail.com","password":""},
    {"id":"2","name":"bob","email":"bob@gmail.com","password":""}
    ]
}

我可以使用 angular ng-repeat

显示 json

<p ng-repeat="data in fulldata">
    {{ data }}
</p>

但是如果我只需要显示推文的内容，即推文的 "tweets" 字段，我该怎么做。

我试过了:-

<p ng-repeat="data in fulldata">
    {{ data.tweets.tweets }}
</p>

但这没有用。

谢谢

Answer 1

您正在遍历全数据，它只有一个 tweets 元素。你需要遍历 fulldata.tweets

<p ng-repeat="data in fulldata.tweets">
    {{ data.tweets}}
</p>

或者如果您需要遍历所有推文的所有完整数据

<div ng-repeat="data in fulldata">
   <p ng-repeat="tweet in data.tweets">
       {{ tweet.tweets }}
   </p>
</div>

Answer 2

你必须循环 tweets 数组。

<p ng-repeat="data in fulldata.tweets">
    {{ data.tweets }}
</p>

Answer 3

因为内部 JSON 是嵌套的所以你需要两个嵌套 ng-repeat

<div ng-repeat="data in fulldata">
 <p ng-repeat="tweets in data.tweets">
    {{ tweets.tweets }}
 </p>
</div>

Answer 4

<p ng-repeat="tweet in fulldata.tweets">
    {{ tweet.tweets }}
</p>

这就是你想要做的，不需要嵌套的 ng-repeats 除非你特别想要它。

如何在 HTML 页面中显示存储在本地存储中的 json 字符串中的 json 数据

How do I display json data in HTML page from json string stored in localstorage

javascript

json

angularjs

ng-repeat