【问题标题】:Angularjs ng-repeat custom filter breaks orderBy filter?Angularjs ng-repeat 自定义过滤器破坏 orderBy 过滤器?
【发布时间】:2013-09-12 06:32:31
【问题描述】:

原始数据:

[
{
    "SHFUserID": "400",
    "AlertID": "12",
    "TickerID": "4512",
    "Ticker": "GOOG",
    "Active": "1",
    "Status": null
},
{
    "SHFUserID": "400",
    "AlertID": null,
    "TickerID": "4512",
    "Ticker": "GOOG",
    "Active": null,
    "Status": null
},
{
    "SHFUserID": "400",
    "AlertID": null,
    "TickerID": "10190",
    "Ticker": "ABM",
    "Active": null,
    "Status": null
},
{
    "SHFUserID": "400",
    "AlertID": null,
    "TickerID": "712",
    "Ticker": "DPAX",
    "Active": null,
    "Status": "1"
}

]

uniqueTickers 过滤器:

.filter('uniqueTickers', function() {
return function(tickers) {
    var tags = {};
    angular.forEach(tickers, function(obj) {

  if(!(obj.Ticker in tags)){
        tags[obj.Ticker] = {id: obj.TickerID, name:obj.Ticker};

    if(!tags[obj.Ticker].pending){
      tags[obj.Ticker].pending = 0;
    }
    if(!tags[obj.Ticker].settled){
      tags[obj.Ticker].settled = 0;
    }
    if(!tags[obj.Ticker].order){
      tags[obj.Ticker].order = 3;
    }
  }

  if(obj.Status === "1"){
    tags[obj.Ticker].pending = 1;
    if(tags[obj.Ticker].order > 2){
      tags[obj.Ticker].order = 2;
    }
  }
  if(obj.Status === "2"){
    tags[obj.Ticker].settled = 1;
    if(tags[obj.Ticker].order > 1){
      tags[obj.Ticker].order = 1;
    }
  };
    });
return tags;
};

结果数据:

{"id":"10190","name":"ABM","pending":0,"settled":0,"order":3}
{"id":"712","name":"DPAX","pending":1,"settled":0,"order":2}
{"id":"4512","name":"GOOG","pending":0,"settled":0,"order":3}

html:

Search: <input ng-model="query.Ticker">
  Sort by:
  <select ng-model="orderProp">
    <option value="name">Alphabetical</option>
    <option value="order">Alert Status</option>
  </select>
  <ul class="tickerList">
    <li ng-repeat="ticker in tickers | filter:query | uniqueTickers | orderBy:orderProp">
      <a href="#/ticker/{{ticker.id}}">{{ticker.name}}</a>
      <p>{{ticker}}</p>
    </li>
  </ul>

我正在尝试按“名称”或“订单”的字母顺序进行过滤,但是一旦我运行 uniqueTickers 过滤器,orderBy 过滤器就不起作用。我不确定我需要向 orderBy 公开什么才能完成这项工作。

【问题讨论】:

    标签: javascript angularjs


    【解决方案1】:

    您当前正在向 orderBy 公开一个对象,这应该是一个数组。

    尝试将 uniqueTickers 过滤器末尾的 return tags; 替换为以下内容:

    var arr = [];
    for (var ticker in tags) {
        arr.push(tags[ticker]);
    }
    return arr;
    

    【讨论】:

    • 对不起,我实际上对 Angular 了解不多,我只是注意到 orderBy 的文档表明它在数组上运行。我的猜测是,如果不是所有过滤器,大多数过滤器都需要数组。
    • 我是 javascript 新手,我认为数组和对象在 javascript 中是可以互换的。我现在知道他们不是。感谢您的帮助。
    猜你喜欢
    • 1970-01-01
    • 2013-05-09
    • 2015-02-24
    • 2020-06-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-05-27
    相关资源
    最近更新 更多