如何在JSON数组angualrjs中显示单个值(how to display individual values within JSON array angualrjs)

我有一个名为（现在）0.json的json文件。我想在json对象中显示某些数组作为单独的值（可能将它们显示为徽章）。

这是我的json：

[ { "id": "Chinwe Chukuwogu Roy WordPress Biography Website", "name": "Chinwe Roy Biography Website", "practices": ["UX", "HTML WireFraming", "Front-End Development", "Custom WordPress Theming"], "technology": ["WordPress", "HTML", "CSS", "JQuery", "TweenMax", "Inkscape", "Photoshop"], "time": "6 Weeks", "description": "A biography website celebrating the work of world reknowned Artist, Chinwe Chukwogu Roy", "images": "../assets/img/ux.svg", "header": "../assets/img/wordpress-project.svg", "behance": "https://www.behance.net/gallery/33173663/UI-Design-A-Website-Biography-Project" } ]

我在我的控制器中像这样调用json：

$http.get('app/resources/v1/projects/' + $routeParams.id + '.json').success(function (details) { $scope.details = details; });

HTML：

<div class="row" ng-controller="ProjectCtrl"> <ng-header class="header-directive">{{ detail.header }}</ng-header> <div class="container"> <div class="row"> <div class="col-md-12 work-parent" ng-repeat="detail in details"> <div class="work-child"> <h1>{{ detail.id }}</h1> <br> <p>{{ detail.description }}</p> <small><strong>technologies:</strong> {{ detail.technology }}</small> <small><strong>design practice:</strong> {{ detail.practices }}</small> <small><strong>turnaround:</strong> {{ detail.time }}</small> <ul class="social-icons"> <li class="behance"><a href="{{ detail.behance }}" target="_blank">behance</a></li> </ul> </div> </div> </div> </div> </div>

我遇到的问题是我无法将实践表现为个人价值观。当我使用ng-repeat绑定detail.practices时，我只是在视图中得到一个完整的数组。

我如何在我的控制器中管理它？

I have a json file named (for now) 0.json. I want to display certain arrays within the json object as individual values (maybe display them as badges).

here is my json:

[ { "id": "Chinwe Chukuwogu Roy WordPress Biography Website", "name": "Chinwe Roy Biography Website", "practices": ["UX", "HTML WireFraming", "Front-End Development", "Custom WordPress Theming"], "technology": ["WordPress", "HTML", "CSS", "JQuery", "TweenMax", "Inkscape", "Photoshop"], "time": "6 Weeks", "description": "A biography website celebrating the work of world reknowned Artist, Chinwe Chukwogu Roy", "images": "../assets/img/ux.svg", "header": "../assets/img/wordpress-project.svg", "behance": "https://www.behance.net/gallery/33173663/UI-Design-A-Website-Biography-Project" } ]

I call the json like this within my controller:

$http.get('app/resources/v1/projects/' + $routeParams.id + '.json').success(function (details) { $scope.details = details; });

HTML:

<div class="row" ng-controller="ProjectCtrl"> <ng-header class="header-directive">{{ detail.header }}</ng-header> <div class="container"> <div class="row"> <div class="col-md-12 work-parent" ng-repeat="detail in details"> <div class="work-child"> <h1>{{ detail.id }}</h1> <br> <p>{{ detail.description }}</p> <small><strong>technologies:</strong> {{ detail.technology }}</small> <small><strong>design practice:</strong> {{ detail.practices }}</small> <small><strong>turnaround:</strong> {{ detail.time }}</small> <ul class="social-icons"> <li class="behance"><a href="{{ detail.behance }}" target="_blank">behance</a></li> </ul> </div> </div> </div> </div> </div>

The issue I am having is that I am unable to show e.g practices as individual values. I just get an complete array in the view when I bind detail.practices with an ng-repeat.

How would I manage this in my controller?