微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

角表与来自Firebase的数据无法排序?

如何解决角表与来自Firebase的数据无法排序?

我已完成创建排序函数及其伪指令,如下所示:

pg_archivecleanup

但是我的html无法调用排序函数,因为它没有在控制台上返回日志,我的html出问题了吗?这是我的html表格的样子:

export type SortDirection = 'asc' | 'desc' | '';
const rotate: { [key: string]: SortDirection } = { 'asc': 'desc','desc': '','': 'asc' };
export const compare = (v1,v2) => v1 < v2 ? -1 : v1 > v2 ? 1 : 0;

export interface SortEvent {
  column: string;
  direction: SortDirection;
}

@Directive({
  selector: 'th[sortable]',host: {
    '[class.asc]': 'direction === "asc"','[class.desc]': 'direction === "desc"','(click)': 'rotate()'
  }
})

export class NgbdSortableHeader {
  
  @input() sortable: string;
  @input() direction: SortDirection = '';
  @Output() sort = new EventEmitter<SortEvent>();

  rotate() {
    console.log('Rotate');
    this.direction = rotate[this.direction];
    this.sort.emit({ column: this.sortable,direction: this.direction });
  }
}

export class ListCustomersComponent implements OnInit { 
  filterCustomers: Customers[] = [];
  sortCustomers: Customers[] = [];

//Sort purpose
@ViewChildren(NgbdSortableHeader) headers: QueryList<NgbdSortableHeader>;

  async getCustomers(token) {
    this.clearMessages();
    this.customeRSService.getCustomers(token).subscribe(result => {
      this.customers = result.filter(x => x.active); // display active customers only
      this.filterCustomers = this.customers;
      this.sortCustomers = this.customers;
      this.totalLengthOfCollection = this.filterCustomers.length;
      this.loadPage = true;
    },err => {
      this.alert.code = err.error.error;
      if (this.alert.code == undefined) {
        this.alert.code = err.statusText;
        this.alert.message = 'Unexpected error encountered.';
        this.alert.status = 'Failed';
        console.log(err);
      } else if (this.alert.code == "Unauthorized") {
        this.customeRSService.denyAccess();
      } else {
        this.alert.message = err.error.message;
        this.alert.status = 'Failed';
      }
    });
  }

//Sort function
  public onSort({ column,direction }: SortEvent) {
    this.headers.forEach(header => {
      if (header.sortable !== column) {
        header.direction = '';
        console.log("hello hello");
      }
    });

    if (direction === '') {
      this.filterCustomers = this.customers;
      this.sortCustomers = this.customers;
      console.log("hello hello hello");
    } else {
      this.sortCustomers = [].sort((a,b) => {
        const res = compare(a[column],b[column]);
        return direction === 'asc' ? res : -res;
      });
      this.filterCustomers = [].sort((a,b[column]);
        return direction === 'asc' ? res : -res;
      });
    }
    
  }
}

我认为我需要在处更正ngFor,但是我不确定如何同时调用 filterCustomers sortCustomers 。它正在显示客户列表,但未对其进行排序。如果我将ngFor放在th,则标题变成三倍

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?