Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/xcode/7.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用下拉菜单筛选ng repeat,而不复制下拉菜单选项_Javascript_Html_Angularjs_Drop Down Menu - Fatal编程技术网

Javascript 使用下拉菜单筛选ng repeat,而不复制下拉菜单选项

Javascript 使用下拉菜单筛选ng repeat,而不复制下拉菜单选项,javascript,html,angularjs,drop-down-menu,Javascript,Html,Angularjs,Drop Down Menu,同样,我可以手动执行筛选:{category:'Popular'}在ng repeat中,我希望能够使用下拉列表执行相同的操作 我能够使基本的工作。我有两个问题:我不希望类别在下拉列表中重复自己,我希望在下拉列表中选择“流行”时能够看到所有分类为“流行”的内容 这是我的HTML: <div ng-controller="SuperCtrl" class="row"> <ul class="small-12 medium-12 columns"> <sel

同样,我可以手动执行
筛选:{category:'Popular'}
ng repeat
中,我希望能够使用下拉列表执行相同的操作

我能够使基本的工作。我有两个问题:我不希望类别在下拉列表中重复自己,我希望在下拉列表中选择“流行”时能够看到所有分类为“流行”的内容

这是我的HTML:

<div ng-controller="SuperCtrl" class="row">
  <ul class="small-12 medium-12 columns">
    <select ng-model="find" ng-options="entry.category for entry in parsedEntries"><option value="">Select Category</option></select>.
    <li ng-repeat="entry in parsedEntries | filter: find">
      <strong>{{ entry.title }} </strong><br>
      {{ entry.description }}
   </li>
 </ul></div>

让它按照您想要的方式工作:

<select ng-model="find" ng-options="entry.category as entry.category for entry in parsedEntries | unique: 'category'">


注意:这本身不是问题,但我从
元素中取出了
元素。

只需将唯一的类别放入名为
类别的字符串数组中,对数组排序,并使用
ng选项显示它即可:

<select ng-model="find" ng-options="category as category for category in categories"><option value="">Select Category</option></select>.

在选择标记内的option和li元素上都使用ng repeat。我想你可以去掉li标签,这样它就不会被复制了(?)太棒了!!非常感谢。请允许我再问一件事:将下拉列表默认设置为第一类项目的最佳方式是什么?您可以为控制器中的变量
find
添加默认值。例如
$scope.find='popular'。但是我必须在唯一过滤器之后的ng options属性值中添加
track by entry.category
,以便默认值显示为选中。
var app = angular.module('myApp', ['angular.filter']);
<select ng-model="find" ng-options="category as category for category in categories"><option value="">Select Category</option></select>.
function contains(a, obj) {
  for (var i = 0; i < a.length; i++) {
    if (a[i] === obj) {
      return true;
    }
  }
  return false;
};

$http.get(url)
.success(function(response) {
  var entries = response['feed']['entry'];
  $scope.parsedEntries = [];
  $scope.categories = [];
  for (key in entries) {
    var content = entries[key];
    var obj = parse(content);
    $scope.parsedEntries.push(obj);

    if (!contains($scope.categories, obj.category))
    {
      $scope.categories.push(obj.category);
    }
  }

  $scope.categories.sort();
})