当前位置:  开发笔记 > 编程语言 > 正文

解析JSON并在Angular中显示数据

如何解决《解析JSON并在Angular中显示数据》经验,为你挑选了1个好方法。

我在Angular中显示JSON数据时遇到了麻烦.我成功地将数据从后端发送到前端(Angular),但我无法显示它们.

我尝试在JSFiddle上模拟类似的情况,尽管我已经从后端准备了数据以下格式

获取/发送数据 - >后端端:

//push data to Redis
var messages= JSON.stringify(
    [
        {
            "name": "Msg1",
            "desc": "desc Msg1"
        },
        {
            "name": "Msg2",
            "desc": "desc Msg2"
        },
        {
            "name": "Msg3",
            "desc": "desc Msg3"
        },
        {
            "name": "Msg4",
            "desc": "desc Msg4"
        }
    ]);
    redisClient.lpush('list', messages, function (err, response) {
        console.log(response);
    });

//get from redis and send to frontend
app.get('/messages', function(req, res){
    // Query your redis dataset here
    redisClient.lrange('list', 0, -1, function(err, messages) {
        console.log(messages);
       // Handle errors if they occur
       if(err) res.status(500).end();
       // You could send a string
       res.send(messages);
       // or json
       // res.json({ data: reply.toString() });
    });
});

获取数据 - >前端(Angular)

angular.module('app')
    .controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
        'use strict';

        getFromServer();
        function getFromServer(){
          $http.get('/messages')
               .success(function(res){
                   $scope.messages= res;
                   console.log(res);
               });
        }
    }])

带有ng-repeat指令的HTML部分:

{{item.name}}

{{item.desc}}

谁会知道问题是什么?



1> Dodekeract..:

据我所知,你将对象存储为JSON,但你永远不会解析它.因此使用

$scope.messages = JSON.parse(res);

代替

$scope.messages = res;

应该解决你的问题.

这是你的JSFiddle版本:https://jsfiddle.net/29y61wtg/5/

请注意,这不包括$ http调用,如果您在使用$ http后仍然遇到问题,请在评论中告诉我.

推荐阅读
wangtao
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有