从可观察的

时间:2017-07-10 15:31:37

标签: javascript angular ecmascript-6

我有一个component从服务中获取数据,并在点击按钮时将数据推送到数组。如果数据中已存在该数据,我不希望再次推送它。

import { ImportResults } from '../shared/mass.interface';
import { Component, Input, OnChanges, OnInit } from '@angular/core';
import { MassEmpService } from '../shared/mass.service';

@Component({
    selector: 'app-employee-selection',
    templateUrl: './employee-selection.component.html',
    styleUrls: ['./employee-selection.component.css']
})

export class EmployeeSelectionComponent implements OnInit {

    // Define our search results
    public searchResults: ImportResults[] = [];

    constructor(
        private _massEmpService: MassEmpService
    ) {
    }

    ngOnInit() {

        // Push our results to the array if they don't already exist
        this._massEmpService.importedResults.subscribe(
            data => (this.searchResults.indexOf(data) === -1 ? this.searchResults.push(...data) : '')
        );

    }
}

是否有任何快速方法可以测试数组中是否已存在相同的对象而无需查找特定的键或值?

方案

我在搜索字段中输入用户名,然后按"搜索"。它为我提供了结果,我将它们推送到一个数组,然后使用*ngFor循环它们并显示它们。但是,如果我然后由主管进行搜索,我不希望结果中已有的任何人再次出现,只有尚未看到的新数据。

我知道这更像是一个通用的Javascript问题,但我很好奇,如果ES6或angular有什么简短可以实现这个目标吗?

2 个答案:

答案 0 :(得分:1)

尝试使用underscore.jsfindIndex方法。

代码就是这样的:

import * as _ from 'underscore';
/*
  rest of your code
*/

export class EmployeeSelectionComponent implements OnInit {
    ngOnInit() {
        // Push our results to the array if they don't already exist
        this._massEmpService.importedResults.subscribe(data => {
             if (this.searchResults.findIndex(elem => _.isEqual(elem,data)) == -1)
                 this.searchResults.push(data);
        });    
    }
/*
  rest of your code
*/
}

其他解决方案是使用.filter() method,但在这里您还需要遍历所有条目:

ngOnInit() {
   // Push our results to the array if they don't already exist
   this._massEmpService.importedResults.filter(data => {
             return this.searchResults.findIndex(elem => _.isEqual(elem,data)) == -1})
        .subscribe(data => this.searchResults.push(data));    
}

我认为立即拒绝具有相同参考的对象也可能是好的:

 this._massEmpService.importedResults.filter(data => data != data).... //another chain here

您还可以尝试使用_.indexOfhttp://underscorejs.org/#indexOf

进行试验

答案 1 :(得分:0)

尝试下面myaaray是你的数组wityh重复条目和uniue数组将包含没有重复条目的数组

var unique = myArray.filter((v, i, a) => a.indexOf(v) === i);