Как заполнить и визуализировать JSON, имеющий массив объектов в angularjs

Question

У меня есть простой массив объектов, который снова содержит массив, который мне нужно вызвать и заполнить с помощью ng repeat в angularjs.Здесь мне нужно заполнить подлинк в теге

. Вывод должен идти один за другим, как

Project1a
Project1b
Project1c
Project1d
Project1e

, но теперь вывод идет как

["Project1a","Project1b","Project1c","Project1d","Project1e"]

Вот код ниже с html и angularjs.

html

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<p ng-repeat="x in records">{{x.sublink}}</p> 
</div

script

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  $scope.records =[{
        "project_id": "1001",
        "project_name": "Project1",
        "project_desc": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s",
        "project_manager": "Manager1",
        "duration": "3 Years",
        "team_size": "10",
        "sublink": ["Project1a", "Project1b", "Project1c", "Project1d", "Project1e"]
    }]


});

---

<div ng-repeat="x in records">
    <p ng-repeat="link in x">{{link.sublink}}</p>
</div>

не работает

Answer 1

Вы перебираете x, но вам нужно перебрать x.sublink

<div ng-app="myApp" ng-controller="myCtrl">
  <div ng-repeat="x in records">

    <p ng-repeat="link in x.sublink">
      {{link}}
    </p>
  </div>
</div>

var BaseApp = angular.module('myApp', ['ngResource']);

BaseApp.run(function($rootScope) {

})

BaseApp.controller("myCtrl", function($scope) {
  $scope.records = [{
    "project_id": "1001",
    "project_name": "Project1",
    "project_desc": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s",
    "project_manager": "Manager1",
    "duration": "3 Years",
    "team_size": "10",
    "sublink": ["Project1a", "Project1b", "Project1c", "Project1d", "Project1e"]
  }]


});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.0.5/angular-resource.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <div ng-repeat="x in records">

    <p ng-repeat="link in x.sublink">
      {{link}}
    </p>
  </div>
</div>