Angular 2 TypeScript 배열 요소 검색 방법

Angular 2 TypeScript 배열 요소 검색 방법

컴포넌트와 서비스가 있습니다.

컴포넌트:

export class WebUserProfileViewComponent {
    persons: Person [];
    personId: number;
    constructor( params: RouteParams, private personService: PersonService) {
          
        
           this.personId = params.get('id');
           this.persons =  this. personService.getPersons();
           console.log(this.personId);  
        }
}

서비스:

@Injectable()
export class PersonService {
      getPersons(){
        var persons: Person[] = [
            {id: 1, firstName:'Hans', lastName:'Mustermann', email: 'mustermann@test.com', company:'Test', country:'DE'},
            {id: 2, firstName:'Muster', lastName:'Mustermann', email: 'mustermann@test.com', company:'test', country:'DE'},
            {id:3, firstName:'Thomas', lastName:'Mustermann', email: 'mustermannt@tesrt.com', company:'test', country:'DE'}
        ];
          
        return persons;
      }
}

아이디('person')의 Person 아이템을 취득하고 싶다.아이디). 그 사람취득한 아이디Routeparams그래서 전치 루프가 필요해?하지만 이에 대한 해결책을 찾지 못했습니다.

다음 방법을 사용해야 합니다.

this.persons =  this.personService.getPersons().filter(x => x.id == this.personId)[0];

또는

this.persons =  this.personService.getPersons().find(x => x.id == this.personId);

다음과 같은 어레이가 있다고 가정합니다.

Skins[
    {Id: 1, Name: "oily skin"}, 
    {Id: 2, Name: "dry skin"}
];

아이템을 입수하려면Id = 1그리고.Name = "oily skin"다음과 같이 시도합니다.

var skinName = skins.find(x=>x.Id == "1").Name;

결과는 skinName이 "Oily skin"으로 반환됩니다.

결합할 수 있습니다..find화살의 기능과 파괴력이 있습니다.MDN에서 이 예를 들어보겠습니다.

const inventory = [
  {name: 'apples', quantity: 2},
  {name: 'bananas', quantity: 0},
  {name: 'cherries', quantity: 5}
];

const result = inventory.find( ({ name }) => name === 'cherries' );

console.log(result) // { name: 'cherries', quantity: 5 }

이 검색을 자주 사용하는 경우 데이터 구조를 지도로 변환

mapPersons: Map<number, Person>;

// prepare the map - call once or when person array change
populateMap() : void {
    this.mapPersons = new Map();
    for (let o of this.personService.getPersons()) this.mapPersons.set(o.id, o);
}
getPerson(id: number) : Person {
    return this.mapPersons.get(id);
}

TypeScript에서 네이티브 JS 배열 필터() 메서드를 사용할 수 있습니다.

let filteredElements=array.filter(element => element.field == filterValue);

원래 배열(0, 1 이상)에서 일치하는 요소만 있는 배열이 반환됩니다.

참고 자료: https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

서비스에서는 다음 코드를 사용합니다.

return this.getReports(accessToken)
        .then(reports => reports.filter(report => report.id === id)[0]);

언급URL : https://stackoverflow.com/questions/37969984/angular-2-typescript-how-to-find-element-in-array