AngularJS NG-重复 JSON答案

【问题标题】：AngularJS NG-Repeat JSONAngularJS NG-重复 JSON
【发布时间】：2016-01-30 03:28:32
【问题描述】：

对于这个简单的问题，我深表歉意。我一直在寻找其他问题，但仍然无法解决问题。

我有一个函数返回一些键/值对

function(data){
    console.log(data.message);
}

返回...

Object {name: "mpierce486", body: "asfsf", time: "1 second ago"}

不登录控制台时出现以下情况...

$scope.message = data.message

最后，这里是标记。我正在使用 Laravel 应用程序，所以我正在使用 @ 转义 {{。什么都没有出现，我知道这是一个简单的错误。请协助！谢谢！

<div ng-app="myApp" ng-controller="messageCtrl">
    <div ng-repeat="x in message" class="main-user-post">
      <h1>@{{ x.body }}</h1>
    </div>
  </div>

【问题讨论】：

标签： angularjs

【解决方案1】：

我认为您不能对对象执行ng-repeat。由于它已经是一个对象，而不是一个数组，你可以直接访问它，无需 ng-repeat。

<div ng-app="myApp" ng-controller="messageCtrl">
    <div class="main-user-post">
      <h1>@{{ message.body }}</h1>
    </div>
  </div>

【讨论】：

您可以通过ng-repeat="(key, val) in object" 对一个对象进行重复 - 但我认为 OP 不希望这样做。

【解决方案2】：

您的消息变量是一个对象，而不是一个数组。因此，在您的迭代中，x 将获取每个对象属性（主体、名称、时间）的值。

所以要么使用不同的方法，要么将您的消息转换为数组：

 $scope.message = [data.message];

【讨论】：

【解决方案3】：

您可以像这样使用 Angular 遍历对象属性：

<div ng-app="myApp" ng-controller="messageCtrl">
    <div ng-repeat="(key, value) in message" class="main-user-post">
      <h1>@{{value}}</h1>
    </div>
</div>

【讨论】：

【解决方案4】：

如下创建对象数组。 JSFiddle - https://jsfiddle.net/L7k6g7ua/ 供参考 w.r.t AngularJs -

希望这会有所帮助！

   <body ng-app="SampleApp">
  <div ng-controller="messageCtrl">
    <div ng-repeat="m in message" class="main-user-post">
      <h1>{{m.body}}</h1>
    </div>
  </div>
</body>

    var sampleApp = angular.module("SampleApp", []);
    sampleApp.controller('messageCtrl', function($scope) {
      var myObject = {
        name: "mpierce486",
        body: "asfsf",
        time: "1 second ago"
      };

      var myArray = [];
      myArray.push(myObject);
      $scope.message = myArray;
    });

【讨论】：