Řada Angular 18 (dvacet šest) implementuje funkce líného vyhledávání založené na RXJS

Malý hajzl · Zveřejněno 28.10.2024 17:18:59

Požadavky: Když se text změní, mělo by být vyvoláno backendové rozhraní, které dotazuje klíčová slova a vrací data, ale často uživatel klíčová slova ještě plně nezadal a událost změny textu se spustí mnohokrát, což způsobí tlak na backendové rozhraní, aby často žádalo, a také je na front-end vyvíjen tlak na časté vykreslování. Jak implementovat funkci zpožděného vyhledávání? To znamená, že když uživatel zadá klíčové slovo úplně, je vyvolán dotaz na backendové rozhraní.

Pro usnadnění prezentace zde je prostředíZpoždění o jednu sekundu, zobrazení jsou následující:

HTML kód stránky:

Přihlášení je viditelné.

Kód komponenty TS je následující:

Přihlášení je viditelné.

(Konec)

Malý hajzl · Zveřejněno 15.05.2025 8:44:41

pipeline debounceTime()
Pipeline debounceTime je vestavěný pipeline v Angularu, který lze použít k debounce událostí. Pro použití pipeline debounceTime musíte předat debounce time (v milisekundách) jako parametr
distinctUntilChanged()
distinctUntilChanged je operátor, který filtruje stejné hodnoty, jež jsou v Observableu vyvolávány postupně. To je užitečné v situacích, kdy chcete zabránit tomu, aby Observable vystřelil stejnou hodnotu opakovaně.

Malý hajzl · Zveřejněno 15.05.2025 9:29:33

AsyncValidatorFn validates latency stabilization

Přihlášení je viditelné.

Odkaz:Přihlášení k hypertextovému odkazu je viditelné.

Malý hajzl · Zveřejněno 15.05.2025 9:33:52

Little Srab Zveřejněno 15. 5. 2025 09:29
AsyncValidatorFn validates latency stabilization

Reference: https://stackoverflow.com/questions/36919011/how-to-add-debounc ...

Další zapouzdření (Netestováno）

Příklad 1:

Přihlášení je viditelné.

Příklad 2:

Přihlášení je viditelné.

[Angular] Řada Angular 18 (dvacet šest) implementuje funkce líného vyhledávání založené na RXJS

Související příspěvky

Prohlížené sekce