2 votes

ng-bootstrap Typeahead objet sélectionné

J'ai https://ng-bootstrap.github.io/#/components/typeahead/api avec la déclaration suivante :

<ng-template #rt let-r="result" let-t="term">
        <span class="device">
            <span class="grayout">{{r?.manufacturer.name}}</span> {{ r?.modelName}},
                <span class="grayout"> {{ r?.year}}, {{r?.operatingSystemVersion.operatingSystem.name}} {{r?.operatingSystemVersion.name}},  {{ r?.note}} </span>
        </span>
        <span class="deviceStats">
            <span class="grayout">{{r?.blockedCount}}x blocked</span>
        </span>
    </ng-template>

    <input id="typeahead-template" type="text" class="form-control" [(ngModel)]="model" [ngbTypeahead]="search" [resultTemplate]="rt"
           [inputFormatter]="formatter" placeholder="Search model, manufacturer, operating system, operation system version, serial number, code etc." />

Et le code des composants :

export class HomeComponent implements OnInit {
    account: Account;
    modalRef: NgbModalRef;
    userReservations: Reservation[];
    model: Device;
    searching = false;
    searchFailed = false;

    search = (text$: Observable<string>) =>
        _do.call(
            switchMap.call(
                _do.call(
                    distinctUntilChanged.call(
                        debounceTime.call(text$, 300)),
                    () => this.searching = true),
                term =>
                    _catch.call(
                        _do.call(this.deviceService.search(term), () => this.searchFailed = false),
                        () => {
                            this.searchFailed = true;
                            return of.call([]);
                        }
                    )
            ),
            () => this.searching = false);

Donc, en gros, la réponse json contient Device[]. La liste avec les options suggérées fonctionne correctement parce que le modèle est utilisé et que je peux accéder aux propriétés, mais lorsque je sélectionne une option dans l'entrée, la valeur [object Object] apparaît. Est-il possible de remplir, par exemple, la méthode toString() à partir de l'objet Device ?

Merci.

6voto

Zbyněk Nevrlý Points 68

Il y a inputFormatter pour ça.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X