Angular 2에 대한 검색 파이프를 만들려고합니다. 중첩 된 개체를 가져 와서 검색어와 일치하는 개체를 필터링해야합니다. 기본 버전이 작동하지만 두 가지 문제가 있습니다.
문제 하나는 이제 키 이름을 하드 코딩하거나 JSON.stringify
.
객체를 필터링하는 더 우아한 방법은 무엇이며 용어를 _id
및 같은 하드 코딩 된 목록을 제외한 값과 일치시키는 것은 url
무엇입니까?
두 번째 문제는 문자열 term
에 공백이 포함되어 있으면이 를 분할하고 obj
두 용어로 필터링하고 싶다는 것 입니다. 을 사용하여 분할 할 수 있습니다 terms = term.split(' ');
.
하지만 여러 용어로 필터링을 수행하려면 어떻게해야합니까?
내 현재 코드 :
import {Pipe} from 'angular2/core';
@Pipe({
name: "search"
})
export class SearchPipe{
transform(obj: any, [term]) {
if (obj != null && term) {
return obj.filter( el => {
//var test = JSON.stringify(el);
//return test.toLowerCase().includes(term.toLowerCase()); //trows a compile error but seems to work.
return el.name.toLowerCase().includes(term.toLowerCase()) || el.place.toLowerCase().includes(term.toLowerCase()) || el.title.toLowerCase().includes(term.toLowerCase()) ;
});
} else {
return obj;
}
}
}
예상 입력 형식 :
[
{
"_id": "56ffbe512ba199777d51c6ae",
"picture": "http://placehold.it/36x36",
"name": "Melissa Reeves",
"company": "Orbixtar",
"place": "Greenwich, Belarus",
"title": "voluptate est ipsum",
"location": {
"lat": -78.926961,
"lng": 90.157653
},
"url": "http://lol.lol"
},
{
"_id": "56ffbe5119cf66e94b3800b4",
"picture": "http://placehold.it/36x36",
"name": "Chelsea Lindsay",
"company": "Squish",
"place": "Vowinckel, Belarus",
"title": "anim ea exercitation",
"location": {
"lat": 66.547582,
"lng": 162.720388
},
"url": "http://lol.lol"
}
]
용어가 "term1"
"term1"이 포함 된 개체를 반환하고 싶습니다.
반면에 용어 인 경우 "term1 term2 term3"
모든 용어를 포함하지만 반드시 특정 순서가 아닌 모든 개체를 반환하고 싶습니다.
Exaple로서.
용어 "Melissa"
는 첫 번째 개체를 반환해야합니다.
용어 "Melissa Belarus"
는 또한 첫 번째 객체 만 반환해야합니다. 두 번째 개체가 키 중 하나와 일치하더라도.
이것을 시도하십시오 (예상되지 않음)
@Pipe({
name: "search"
})
export class SearchPipe{
transform(obj: any, [term]) {
if (obj != null && term) {
return obj.filter( el => {
var test = JSON.parse(JSON.stringify(el));
delete test['url'];
delete test['_id'];
var testString = JSON.stringify(test);
Object.keys(test).forEach(k => {
testString = testString.replace(k, '');
});
let terms = term.replace(/[\s]+/gm, " ").replace(/^[\s]|[\s]$/gm, "").split(' ');
let containCount = 0;
terms.forEach(t => {
if(testString.toLowerCase().indexOf(t.toLowerCase()) > -1)
{
++containCount;
}
});
return (containCount == terms.length);
});
} else {
return obj;
}
}
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다