Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/ruby-on-rails-4/2.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
Html Angular JS filter基于类别数组的概述_Html_Angularjs_Json - Fatal编程技术网

Html Angular JS filter基于类别数组的概述

Html Angular JS filter基于类别数组的概述,html,angularjs,json,Html,Angularjs,Json,我试图做的是创建一个概述,它可以根据嵌套在JSON对象数组中的类别进行过滤 我要创建概述的项目的JSON如下所示: { id: 1, title: "title", content: "content", categories: [{ title: "cat1", descripton: "desc" }, { title: "cat2", descripton: "desc" }] }, { id: 2, ti

我试图做的是创建一个概述,它可以根据嵌套在JSON对象数组中的类别进行过滤

我要创建概述的项目的JSON如下所示:

{
  id: 1,
  title: "title",
  content: "content",
  categories: [{
      title: "cat1",
      descripton: "desc"
  },
  {
      title: "cat2",
      descripton: "desc"
  }]
},
{
  id: 2,
  title: "title",
  content: "content",
  categories: [{
      title: "cat3",
      descripton: "desc"
  },
  {
      title: "cat4",
      descripton: "desc"
  }]
}
<select ng-model="catselect">
  <option>cat1</option>
  <option>cat2</option>
  <option>cat3</option>
  <option>cat4</option>
</select>
<ul>
  <li ng-repeat="item in array | filter: {ARRAY OF CATEGORIES: catselect}">

  </li>
</ul>
HTML的外观如下所示:

{
  id: 1,
  title: "title",
  content: "content",
  categories: [{
      title: "cat1",
      descripton: "desc"
  },
  {
      title: "cat2",
      descripton: "desc"
  }]
},
{
  id: 2,
  title: "title",
  content: "content",
  categories: [{
      title: "cat3",
      descripton: "desc"
  },
  {
      title: "cat4",
      descripton: "desc"
  }]
}
<select ng-model="catselect">
  <option>cat1</option>
  <option>cat2</option>
  <option>cat3</option>
  <option>cat4</option>
</select>
<ul>
  <li ng-repeat="item in array | filter: {ARRAY OF CATEGORIES: catselect}">

  </li>
</ul>

第一类
第二类
第三类
第四类

目前我还不知道如何让它工作。(我认为)最明显的解决方案应该是
filter:{categories.title:catselect}
之类的东西,但显然不是。据我所知,没有其他关于Stackoverflow的问题可以解决这个问题。我很想看看是否有人能帮我。

你能试试看它是否有效吗?我并没有真正测试它

filter: { categories: { title: catselect } }

一个自定义的过滤器将工作

角度模块(“应用程序”,[]) .控制器(“测试”,功能($范围){ $scope.array=[{ id:1, 标题:“标题”, 内容:“内容”, 类别:[{ 标题:“cat1”, 描述词:“描述” }, { 标题:“第二类”, 描述词:“描述” }] }, { id:2, 标题:“标题2”, 内容:“内容”, 类别:[{ 标题:“cat3”, 描述词:“描述” }, { 标题:“cat4”, 描述词:“描述” }] }] }) .filter(“filterByCat”,函数(){ 返回功能(输入、catselect){ 如果(catselect!=未定义){ 变量f=[] 角度forEach(输入、功能(el){ if((el.categories.filter)(功能(cat){ 返回cat.title==catselect })).长度>0)f.推力(el); }) 返回f; }否则{ 返回输入; } } });

第一类
第二类
第三类
第四类
  • {{item.title}

谢谢您的麻烦!但是,这个解决方案不起作用:(尝试我答案的变体,如:过滤器:{categories:{title:catselect}}或其他,当我在对象中有一个对象时,这实际上对我起作用,没有尝试在对象中使用数组。。这确实起作用!:)你能编辑你的答案让我接受吗?Eddited答案=)