заполнить несколько выпадающих выпадающих блоков из данных JSON в угловом

Question

Во-первых, после многочисленных поисков этот question не отвечает на мою проблему.

Я использую AngularJS Dropdown Multiselect и хочу заполнить ряд выпадающих списков, которые извлекаются из моих данных JSON. Пример этих данных ниже:

{ 
    "results": [ 

     { 
      "title": "Difficulty", 
      "icon": "difficulty-icon", 
      "filters": [{ 
       "name": "Easy", 
       "checked": false 
      }, { 
       "name": "Medium", 
       "checked": false 
      }, { 
       "name": "Hard", 
       "checked": false 
      }, { 
       "name": "Expert", 
       "checked": false 
      }] 
     }, 

     { 
      "title": "Direction of Movement", 
      "icon": "direction-icon", 
      "filters": [{ 
       "name": "Flexion", 
       "checked": false 
      }, { 
       "name": "Ulnar Deviation", 
       "checked": false 
      }, { 
       "name": "Radial Deviation", 
       "checked": false 
      }] 
     }, 

     { 
      "title": "Exercise Aim", 
      "icon": "aim-icon", 
      "filters": [{ 
       "name": "Power", 
       "checked": false 
      }, { 
       "name": "Strength", 
       "checked": false 
      }] 
     }, { 
      "title": "Muscle Group ", 
      "icon": "muscle-icon", 
      "filters": [{ 
       "name": "Foot & Shin", 
       "checked": false 
      }] 
     }, 

     { 
      "title": "Joint", 
      "icon": "joint-icon", 
      "filters": [{ 
       "name": "Foot and Ankle", 
       "checked": false 
      }, { 
       "name": "Knee", 
       "checked": false 
      }] 
     } 

    ] 
} 

Когда любой из этих элементов выбираются мне нужно нажать значение в массив (массив не является специфическим для выпадающего списка он пришел с, следовательно, может совместно использовать ту же самую модель).

Я хотел бы запустить ng-repeat, который будет создавать 5 выпадающих списков, которые заполняются из данных выше, с помощью пользовательского текстового текста, отображающего Title из моих данных JSON.

Возможно ли это? Если не так, как я могу запустить функцию в моем контроллере, чтобы seporate этих данных для того, чтобы разоблачить каждый раздел данных JSON в $scope

UPDATE

До сих пор мне удалось получить это: однако не знает, как Я могу получить Title свойство

<div ng-repeat="select in Filters"> 
    <div ng-dropdown-multiselect="" options="Filters[$index].filters" selected-model="example1model" extra-settings="filterSettings"></div> 
</div> 

Answer 1

Вот фрагмент с примером MultiSelect выпадающего списка в цикле ngRepeat:

var app = angular.module('myApp', ['angularjs-dropdown-multiselect']); 
 

 
app.controller("appController", function($scope) { 
 

 
    $scope.filterSettings = { 
 
    displayProp: 'name', 
 
    idProp: 'name' 
 
    }; 
 

 
    $scope.all_data = { 
 
    "results": [ 
 

 
     { 
 
     "title": "Difficulty", 
 
     "icon": "difficulty-icon", 
 
     "filters": [{ 
 
      "name": "Easy", 
 
      "checked": false 
 
     }, { 
 
      "name": "Medium", 
 
      "checked": false 
 
     }, { 
 
      "name": "Hard", 
 
      "checked": false 
 
     }, { 
 
      "name": "Expert", 
 
      "checked": false 
 
     }] 
 
     }, 
 

 
     { 
 
     "title": "Direction of Movement", 
 
     "icon": "direction-icon", 
 
     "filters": [{ 
 
      "name": "Flexion", 
 
      "checked": false 
 
     }, { 
 
      "name": "Ulnar Deviation", 
 
      "checked": false 
 
     }, { 
 
      "name": "Radial Deviation", 
 
      "checked": false 
 
     }] 
 
     }, 
 

 
     { 
 
     "title": "Exercise Aim", 
 
     "icon": "aim-icon", 
 
     "filters": [{ 
 
      "name": "Power", 
 
      "checked": false 
 
     }, { 
 
      "name": "Strength", 
 
      "checked": false 
 
     }] 
 
     }, { 
 
     "title": "Muscle Group ", 
 
     "icon": "muscle-icon", 
 
     "filters": [{ 
 
      "name": "Foot & Shin", 
 
      "checked": false 
 
     }] 
 
     }, 
 

 
     { 
 
     "title": "Joint", 
 
     "icon": "joint-icon", 
 
     "filters": [{ 
 
      "name": "Foot and Ankle", 
 
      "checked": false 
 
     }, { 
 
      "name": "Knee", 
 
      "checked": false 
 
     }] 
 
     } 
 

 
    ] 
 
    }; 
 
    
 
    angular.forEach($scope.all_data.results, function(item, key) { 
 
    item.model = []; 
 
    }); 
 

 

 
});

<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 
<head> 
 
    <meta charset="utf-8" /> 
 
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script> 
 
    <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.14.3.js"></script> 
 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> 
 
    <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script> 
 
    <script src="//rawgit.com/dotansimha/angularjs-dropdown-multiselect/master/src/angularjs-dropdown-multiselect.js"></script> 
 
    <script src="app.js"></script> 
 
</head> 
 

 
<body ng-controller="appController"> 
 
    <div> 
 
    <div ng-repeat="mydata in all_data.results"> 
 
     <div ng-dropdown-multiselect="" options="mydata.filters" selected-model="mydata.model" extra-settings="filterSettings"></div> 
 
     <pre>mydata.model = {{mydata.model | json}} 
 
     </pre> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

Модели, которые получают пользовательский ввод (выбор) для каждого множественного выбора добавляется к данным в цикле Angular.forEach.