그누보드에 어울리는 비동기 검색 엔진
본문
여행사 웹사이트를 만드는데,
1. 나라 선택
2. 도시 선택
3. 호텔 선택
4. 가격 선택
이렇게 해야 하는데, php 기존에는 나라 선택하고 도시로 페이지 이동했거든요,
이렇게 안하고 Angular 혹은 HTMX 로 비동기 검색이 가능하게 하려 합니다.
가능할까요?
어떤것을 추천하시나요?
답변 3
어떤 문자열이나 어떤 json 이라 해도 패턴만 추출할 수 있으면 txt 문서 하나에 정보를 다 담아서 모든 형태의 비동기가 가능합니다.
개인적으로는 단순 js 파일을 추천합니다.
동기 비동기를 따질 필요도 없습니다.^^
Angular와 HTMX 모두 비동기 요청을 간단하게 처리할 수 있게 해줍니다.
HTML 요소에 hx-get, hx-trigger, hx-target, hx-swap, hx-vals 등의 HTMX 속성을 추가하여 이벤트를 정의하고 HTMX가 어떻게 동작해야 하는지 설정합니다.
참고하시면되겠습니다.
[Django] #15 - Django 게시판 만들기(검색기능 구현)- 6 — 나무늘보의 개발 블로그 (sloth-lifes.com)
Angular 가 좋으실듯 합니다.
나라 선택
import { Component } from '@angular/core';
@Component({
selector: 'app-country-selection',
template: '<select (change)="onCountryChange($event.target.value)"></select>'
})
export class CountrySelectionComponent {
onCountryChange(country: string) {
}
}
도시 선택
import { Component } from '@angular/core';
@Component({
selector: 'app-city-selection',
template: '<select (change)="onCityChange($event.target.value)"></select>'
})
export class CitySelectionComponent {
onCityChange(city: string) {
}
}
호텔 선택
import { Component } from '@angular/core';
@Component({
selector: 'app-hotel-selection',
template: '<select (change)="onHotelChange($event.target.value)"></select>'
})
export class HotelSelectionComponent {
onHotelChange(hotel: string) {
}
}
가격 선택
import { Component } from '@angular/core';
@Component({
selector: 'app-price-selection',
template: '<input type="number" (input)="onPriceChange($event.target.value)" />'
})
export class PriceSelectionComponent {
onPriceChange(price: number) {
}
}
답변을 작성하시기 전에 로그인 해주세요.