如何用Angular正确实现帖子

时间:2016-07-01 14:43:03

标签: javascript arrays json angularjs http-post

我在下面发布了我的代码以及我想要显示的JSON数据。具体来说,我希望能够{{client.label}}并将客户端放在列表中。不幸的是,唯一可行的是当我做{{client}}时,它给了我整个JSON对象,这是我不想要的。我是Angular的新手,我知道我显然做错了什么,但我不太清楚是什么。任何帮助表示赞赏!

<body ng-controller="myController">
  <ul>
    <li ng-repeat="client in userData">
      {{client.label}}
    </li>
  </ul>
  <script>
    var app = angular.module('myApp', []);
    app.controller("myController", function ($scope, $http) {
      $http({
        url: 'myURL/blah/blah',
        method: 'POST',
        data: {
          common: { clientName: '6012' },
          qualifier: '$ALL.$ALL.$ALL.$ALL.$ALL',
          pattern: 'configs\\..*'
        },
        headers: { 'Content-Type': 'application/json' }
      }).success(function(data) {
        $scope.userData = data;
      });
    });
  </script>
</body>
{
  "data": {  
    "parameters": [  
      {  
        "qualifier": "$ALL.$ALL.$ALL.$ALL.$ALL",
        "key": "themes",
        "value": {  
          "amairlines": {  
            "id": "amairlines",
            "label": "American Airlines"
          },
          "amazonfork": {  
            "id": "amazonfork",
            "label": "Amazon Fork"
          },
          "bestbuy": {  
            "id": "bestbuy",
            "label": "Best Buy"
          },
          "botw": {  
            "id": "botw",
            "label": "Bank of the West"
          },
          "bbva": {  
            "id": "bbva",
            "label": "BBVA"
          },
          "redleaf": {  
            "id": "redleaf",
            "label": "Red Leaf"
          },
          "citi": {  
            "id": "citi",
            "label": "Citi"
          },
          "costco": {  
            "id": "costco",
            "label": "Costco"
          },
          "firstcitizens": {  
            "id": "firstcitizens",
            "label": "First Citizens"
          },
          "publix": {  
            "id": "publix",
            "label": "Publix"
          },
          "homedepot":{  
            "id": "homedepot",
            "label": "Home Depot"
          },
          "hsbc": {  
            "id":"hsbc",
            "label": "HSBC"
          },
          "huntington": {  
            "id": "huntington",
            "label": "Huntington"
          },
          "kohls": {  
            "id": "kohls",
            "label": "Kohls"
          },
          "nordstrom": {  
            "id": "nordstrom",
            "label": "Nordstrom"
          },
          "paypal": {  
            "id": "paypal",
            "label": "PayPal"
          },
          "primax": {  
            "id": "primax",
            "label": "Primax"
          },
          "td": {  
            "id": "td",
            "label": "Toronto Dominion"
          },
          "usaa": {  
             "id": "usaa",
             "label": "USAA"
          }
        }
      }
    ]
  }
}

2 个答案:

答案 0 :(得分:2)

将ng-repeat更改为:

<li ng-repeat="client in userData.parameters[0].value">
  {{client.label}}
</li>

答案 1 :(得分:1)

要迭代的数据不是返回但更深的数据。 你应该改变 $scope = data; $scope = data.parameters[0].value; 或者改变它重新调整的方式。

还有一件事,通常最好通过集中服务处理数据。

相关问题