Question

这是一个我正在努力尝试习惯ng-repeat指令的项目。到目前为止我创建了以下内容。

它的工作，但我试图添加更多，以使其更好地工作。我一直在尝试添加按钮或下拉菜单来选择我的JSON的一部分来进行ng-repeat。

在我的例子中，我有锻炼的锻炼日。

我想要一个显示日期的下拉菜单我正在研究的一件事情并没有找到很多这样做的事情。

基本上我希望它根据所有来自我的JSON文件的下拉日菜单选择从JSON加载练习。

PLUNKER： http://plnkr.co/edit/IRis4l3r0MVCjpLNd3Q3

var app = angular.module('app', []).config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
// Allow same origin resource loads.
'self',
'http://*.bodybuilding.com/**'
]);
});
app.controller('homeCtrl', function($scope) {


$scope.data = {JSON FILE}

$scope.exercises = [];
angular.forEach($scope.data.day, function(day, index) {
  console.log(day);
  angular.forEach(day.exercises, function(exercise, index){
    //console.log(posters);
    $scope.exercises.push(exercise);
  });
});
console.log($scope.data);

});

*任何帮助将不胜感激。

Answer 1

我分叉你的plunker，下拉列表现在按$ scope.data中的日期数组进行组织，并在每个下拉项目中重复每个练习名称。

你可以在这里查看：

http://plnkr.co/edit/DoIBDv2w0vY4zAWSq89D?p=preview

//Important html code
<li><a href="#" ng-repeat="day in data.day" ng-click="selectedDay($index)">day {{$index}}  |  <span ng-repeat="exercise in day.exercises">{{exercise.name}}</span></a></li>

尝试点击下拉元素。

基本上，你需要在ng-repeat中进行ng-repeat，因为你是在几天内首先进行迭代，并且每天你想要与它进行交互练习。

希望我帮助过：）

AngularJs Json Ng-repeat with Button Control

1 个答案: