相关疑难解决方法(0)

Angular.js ng-repeat过滤属性具有多个值之一(值的OR)

是否可以过滤对象数组,以便属性值可以是几个值(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)

javascript angularjs angularjs-ng-repeat angularjs-filter

56
推荐指数
5
解决办法
13万
查看次数

使用ng-repeat按多列过滤

我想知道在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})

过滤工作,但同样,它是匹配列的交集,而不是联合.谢谢!

angularjs

18
推荐指数
4
解决办法
6万
查看次数

angularjs过滤器(不工作)

以下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)

javascript json angularjs

16
推荐指数
2
解决办法
4万
查看次数

AngularJS - 过滤空对象

我有一个$ 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

15
推荐指数
4
解决办法
4万
查看次数

AngularJS if语句带有ng-repeat

我在尝试使用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)

javascript if-statement angularjs

11
推荐指数
3
解决办法
4万
查看次数

如何使用AngularJS对多个对象应用过滤器?

我有如下定义的用户对象.

$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'时,我希望过滤器显示用户的名称和朋友的姓名/年龄.任何人都可以帮我解决这个问题吗?

如果我是正确的,那么我认为我需要为此创建自定义过滤器,还是有其他方法可以实现此目的?

javascript javascript-framework angularjs

7
推荐指数
1
解决办法
2万
查看次数

显示基于Angular中另一个选择的选项列表

我有两个选择下拉列表,其中第二个选项中的选项取决于在第一个选择中选择的选项.

目前我正试图找出应该从服务器返回数据的方式,这取决于我设置我的方式filter(s).

对于使用多个选择下拉列表过滤数据结构时的最佳实践,我将不胜感激.

以防万一我正在开发/测试当前稳定版本的AngularJS(v1.3.15).

数据结构1 - 嵌套:

$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)

javascript filter angularjs

7
推荐指数
1
解决办法
7731
查看次数

ng-repeat中的角度过滤器与深对象

我正在按照这个问题过滤一个字段的ng-repeat

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

我尝试过 …

javascript angularjs angularjs-ng-repeat angular-filters

6
推荐指数
1
解决办法
5627
查看次数

angular.js ng-repeat division

我有一系列具有这种结构的类别:

{
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)

它有效,但我认为这不是一个好主意.

javascript angularjs

5
推荐指数
1
解决办法
871
查看次数

根据搜索输入过滤ng-repeat

我有以下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而非一个或.

angularjs angularjs-ng-repeat angularjs-filter

4
推荐指数
1
解决办法
2万
查看次数