简体   繁体   English

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

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

I have data returned from laravel in the following format. 我有以下格式从laravel返回的数据。 I store this in localstorage to be used by the users once he logs in. 我将其存储在localstorage中,供用户登录后使用。

I am using angular in frontend, this is how I store it 我在前端使用角度,这是我存储它的方式

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

This is the json data 这是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":""}
    ]
}

I am able to display the json using angular ng-repeat 我能够使用角度ng-repeat显示json

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

But if I need to just display the content of tweets ie "tweets" field of tweets, how do I do that. 但是,如果我只需要显示推文的内容,即推文的“推文”字段,我该怎么做。

I tried :- 我试过了 :-

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

but this did not work. 但这没用。

Thanks 谢谢

You are looping through fulldata, which has just single tweets element. 你正在循环遍历fulldata,它只有一个推文元素。 you need to loop through fulldata.tweets 你需要循环遍历fulldata.tweets

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

or if you need to loop through all fulldata for all tweets 或者如果您需要遍历所有推文的所有全部数据

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

you have to loop on tweets array. 你必须循环推文数组。

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

since the inner JSON is nested so you need two nested ng-repeat 因为内部JSON是嵌套的,所以你需要两个嵌套的ng-repeat

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

This is what you want to do, no need for nested ng-repeats unless you specifically want that. 这是你想要做的,除非你特别想要,否则不需要嵌套的ng-repeats。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM