是否可以过滤对象数组,以便属性值可以是几个值(OR条件),而无需编写自定义过滤器
这类似于这个问题 - Angular.js ng-repeat:按单个字段过滤
而不是
<div ng-repeat="product in products | filter: { color: 'red' }">
Run Code Online (Sandbox Code Playgroud)
有可能做这样的事情
<div ng-repeat="product in products | filter: { color: 'red'||'blue' }">
Run Code Online (Sandbox Code Playgroud)
如下样本数据─
$scope.products = [
{ id: 1, name: 'test', color: 'red' },
{ id: 2, name: 'bob', color: 'blue' }
/*... etc... */
];
Run Code Online (Sandbox Code Playgroud)
我没试过
<div ng-repeat="product in products | filter: { color: ('red'||'blue') }">
Run Code Online (Sandbox Code Playgroud) 我想知道在Angular中是否有一种简单的方法可以ng-repeat使用or逻辑而不是使用特定列来过滤表and.现在,我的过滤器正在搜索表格中的所有内容(10列数据),当它真的只需要过滤2列数据(ID和名称)时.
我已经设法让它在过滤时只查看那两列(通过在文档中使用过滤器表达式中的对象并查看此SO答案),但它使用的是and逻辑,这太具体了.我想让它使用or逻辑,但我遇到了麻烦.
我的HTML
<input type="text" ng-model="filterText" />
<table>
<tr ng-repeat="item in data"><td>{{ item.id }}</td><td>{{ item.name }}</td>...</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
我的过滤逻辑:
$filter('filter')(data, {id:$scope.filterText, name:$scope.filterText})
过滤工作,但同样,它是匹配列的交集,而不是联合.谢谢!
以下HTML,Javascript和JSON正确呈现,但过滤器根本不起作用.我们做错了什么?
<div data-ng-controller="dashboard_controller">
<h1>
Catalogs
<input type="text" data-ng-model="catalog_filter" placeholder="Filter Distributors">
</h1>
<div class="catalogs_listing">
<ul data-ng-repeat="catalog in catalogs | filter:catalog_filter">
<li><a href="{{catalog.distributor_id}}/d/products/catalog_view/{{catalog.uid}}">
<div class="catalog_thumb">
<div class="catalog_thumb_image">
<img src="{{catalog.thumb_image}}" />
</div>
</div>
<div class="catalog_info">
<h2>{{distributors[catalog.distributor_id].name}}
<span>{{catalog.products_count}}p</span>
</h2>
<p>{{catalog.name}}</p>
</div>
</a>
</li>
</ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
Javascript:
app.controller('dashboard_controller', function ($scope, $http) {
$http.get('./api/distributors/my').then(function (res) {
$scope.distributors = res.data;
});
$http.get('./api/dashboard/catalogs').then(function (res) {
$scope.catalogs = res.data;
});
});
Run Code Online (Sandbox Code Playgroud)
这两个JSON:
API /分销/我:
{
"data": {
"9kkE1sL8vXSZMVaL": {
"created": "1346840145.22",
"uid": "9kkE1sL8vXSZMVaL",
"created_by": "3W7AoIQHTtvPauaK",
"name": "Nikee",
"description": …Run Code Online (Sandbox Code Playgroud) 我有一个$ scope.myData对象,包含一大块数据.我想要做的是显示数据,但过滤掉空值和空字符串:
$scope.myData = [
{
"ID" : "001",
"Message" : "test test test test"
},
{
"ID" : "002",
"Message" : "test test test test"
},
{
"ID" : "003",
"Message" : "test test test test"
},
{
"ID" : "004",
"Message" : "test test test test"
},
{
"ID" : "005",
"Message" : " "
},
{
"ID" : "006",
"Message" : "test test test test"
},
{
"ID" : "007",
"Message" : "test test test test"
}, …Run Code Online (Sandbox Code Playgroud) angularjs angularjs-scope angularjs-ng-repeat angular-filters
我在尝试使用if和重复声明时遇到了麻烦.
我正在获取数据,如下所示:
modules: Array[1]
0: Object
embed: "<iframe width="600" height="338" src="https://www.youtube.com/embed/UqdDAn4_iY0"
frameborder="0" allowfullscreen="" style="margin:0px auto;display:block;"></iframe>"
type: "embed"
1: Object
src: "https://m1.behance.net/rendition/modules/127899607/disp/072cebf2137c78359d66922ef9b96adb.jpg"
type: "image"
Run Code Online (Sandbox Code Playgroud)
所以,如果模块有一种图像,我想得到图像.如果它有类型嵌入,我想得到iframe.我目前的观看代码是:
<div ng-repeat="project in project.modules" ng-if="project.type == 'image'">
<img src="{{ project.src }}" class="img-responsive img-centered" alt="{{ project.name }}"/>
</div>
Run Code Online (Sandbox Code Playgroud)
如果我拿出ng-if,它效果很好.控制台输出以下错误:
Error: Multiple directives [ngRepeat, ngIf] asking for transclusion on: <!-- ngRepeat: project in project.modules -->
Run Code Online (Sandbox Code Playgroud) 我有如下定义的用户对象.
$scope.users = [{id: 1, name: 'Adam', friends: [{name: 'John', age: 21, sex: 'M'}, {name: 'Brad', age: 32, sex: 'M'}]}]
Run Code Online (Sandbox Code Playgroud)
然后我有以下代码:
<div ng-repeat="user in users>
<input type="text" ng-model="searchText">
<div ng-repeat="friend in user.friends | filter:searchText">
{{user.name}} {{friend.name}} {{friend.age}}
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
现在,当我在文本框中键入文本:'searchText'时,我希望过滤器显示用户的名称和朋友的姓名/年龄.任何人都可以帮我解决这个问题吗?
如果我是正确的,那么我认为我需要为此创建自定义过滤器,还是有其他方法可以实现此目的?
我有两个选择下拉列表,其中第二个选项中的选项取决于在第一个选择中选择的选项.
目前我正试图找出应该从服务器返回数据的方式,这取决于我设置我的方式filter(s).
对于使用多个选择下拉列表过滤数据结构时的最佳实践,我将不胜感激.
以防万一我正在开发/测试当前稳定版本的AngularJS(v1.3.15).
$scope.optionObjs = [
{
id: 1, name: 'option 1', desc: '',
elements: [
{ id: 9, name: 'option 11', desc: '', },
{ id: 10, name: 'option 12', desc: '', },
{ id: 11, name: 'option 13', desc: '', },
{ id: 12, name: 'option 14', desc: '', },
{ id: 13, name: 'option 15', desc: '', },
],
},
];
Run Code Online (Sandbox Code Playgroud)
我希望在我的html中使用角度过滤器,如下面的例子,但似乎没有用.
<select data-ng-model="firstSelect" data-ng-options="option.name for option in optionObjs"></select>
<select data-ng-model="secondSelect" …Run Code Online (Sandbox Code Playgroud) 我正在按照这个问题过滤一个字段的ng-repeat
但是我的情况不同,它实际上是主对象的对象值中的一个字段.基本上我只想展示data.a == 1
以下代码适用于第一个列表.第二个列表给我错误:
angular.module('myapp', [])
.controller('mainCtrl', function ($scope) {
$scope.items = [{
name: "John",
data: {
a: 1
}
}, {
name: "Lee",
data: {
a: 2
}
}, {
name: "Rue",
data: {
a: 3
}
}, {
name: "Peter",
data: {
a: 1
}
}];
});
Run Code Online (Sandbox Code Playgroud)
HTML
<div ng-controller="mainCtrl">
<h1>List 1</h1>
<p ng-repeat="item in items">{{ item.name }}</p>
<h1>List 2</h1>
<p ng-repeat="item in items | filter: {data.a :1}">{{ item.name }}</p>
</div>
Run Code Online (Sandbox Code Playgroud)
http://plnkr.co/edit/nh4GryqZJbEiXSzMzTKk
有关如何做到这一点的任何帮助还是有更好的方法?
更新1
我尝试过 …
我有一系列具有这种结构的类别:
{
name: 'something',
main_category: 'A'
}
Run Code Online (Sandbox Code Playgroud)
所以每个类别都有它的主要类别.我想在html中显示所有类别,如下所示:
<h1>A</h1>
<ul>
<li>list of categories that has main category A</li>
</ul>
<h1>B</h1>
<ul>
<li>list of categories that has main category B</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
我应该如何实现呢?我找到的唯一方法是做这样的事情:
<h1>A</h1>
<ul>
<li ng-repeat="category in categories" ng-if="category.main_category == 'A'">..</li>
</ul>
<h1>B</h1>
<ul>
<li ng-repeat="category in categories" ng-if="category.main_category == 'B'">..</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
它有效,但我认为这不是一个好主意.
我有以下html:
<div>
<div>
<input type="text" placeholder="Search" ng-model="userSearch.firstname">
</div>
</div>
<div>
<div ng-repeat="user in users | filter:userSearch ">
<div>
{{user.firstname}} {{user.lastname}}
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
所以我有一个输入字段,用户可以在我的所有用户列表中键入和搜索.有没有办法可以根据用户在搜索输入中输入的内容在ng-repeat中应用内联过滤器?
当前解决方案仅过滤firstname
我想过滤名字和姓氏
尝试:
<div>
<div>
<input type="text" placeholder="Search" ng-model="userSearch">
</div>
</div>
<div>
<div ng-repeat="user in users | filter:{firstname: userSearch, lastname: userSearch} ">
<div>
{{user.firstname}} {{user.lastname}}
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
但我认为这是一个AND而非一个或.