So verwenden Sie die automatische Vervollständigung in Ionic3-UI-Komponenten

Dieser Artikel stellt hauptsächlich die relevanten Informationen zur automatischen Vervollständigung von Ionic3 UI-Komponenten vor. Interessierte Freunde können darauf verweisen

Ob Webentwicklung oder App-Entwicklung, Autovervollständigung ist eine der am häufigsten verwendeten Komponenten.

Leider bietet ionic diese Komponente derzeit nicht offiziell an.

ionic2-autocomplete ist eine Open-Source-Ionic2-Komponente auf GitHub. In diesem Artikel wird erklärt, wie Sie sie in Ihren eigenen Projekten verwenden.

Komponentenadresse: github.com/kadoshms/ionic2-autocomplete

1) npm install ionic2-auto-complete --save

2) Öffnen Sie app.module.ts, fügen Sie hinzu: import { AutoCompleteModule } from 'ionic2-auto-complete';

und fügen Sie AutoCompleteModule im imports-Array

hinzu

3) Öffnen Sie app.scss und fügen Sie hinzu: @import "../../node_modules/ionic2-auto-complete/auto-complete";

4) Suchen Sie direkt die auf Ihrer Seite verwendeten Komponenten ：

5) DataProvider zur automatischen Vervollständigung hinzufügen: Schreiben Sie einen Dienst, um Daten aus dem Hintergrund abzurufen, ionic g Provider Autocomplete-Service,

Der Code lautet wie folgt:

Vergessen Sie nicht, app.module.ts hinzuzufügen:

import{AutocompleteServiceProvider }from'.. /providers/autocomplete-service/autocomplete-service';

und fügen Sie AutocompleteServiceProvider zum Provider-Array hinzu.

7) Fügen Sie in der Seiten-TS-Datei, in der Sie die Autocomplete-Komponente verwenden, Folgendes hinzu:

import{AutocompleteServiceProvider}from'../../providers/autocomplete-service/autocomplete-service' ; Im Konstruktor hinzugefügtKonstruktor: publicautocompleteSer:AutocompleteServiceProvider

8) Ändern Sie den Ort, an dem ion-auto-complete verwendet wurde, in: 9)

ionisch servieren und die Wirkung sehen.

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die automatische Vervollständigung in Ionic3-UI-Komponenten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!