В моем приложении angular2 есть форма поиска. Он содержит поля ввода, раскрывающийся список, автозаполнение и автозаполнение с множественным выбором. После поиска мне нужно очистить эту форму, но все будет очищено, за исключением автоматического завершения с множественным выбором. Как я могу удалить это. Что у меня есть:

Component.html

<div class="form-group">
     <label class="col-md-3 control-label">Status</label>
            <div class="col-md-4">
                 <input id="status" type="text" class="form-control" autocomplete="off" [(ngModel)]="ticket.status" [ngModelOptions]="{standalone: true}"
                                    (keyup)=filterStatus() placeholder="select status">
                        <div class="suggestions" *ngIf="filteredStatusList.length > 0">
                        <ul *ngFor="let status of filteredStatusList">
                            <li>
                                <a (click)="selectStatus(status)">{{status}}</a>
                            </li>
                        </ul>
            </div>
            <div *ngFor="let status of selectedStatus">
                 <div id="selected" class="selected">
                      <span id="selectedStatus">{{status}}</span>
                            <a (click)="removeStatus(status)">x</a>
                 </div>
            </div>
         </div>
</div>

Это автозаполнение с множественным выбором. он не будет удален после поиска.

Component.ts

search() {
   // serach code here
}

После поиска это выглядит так. Как я могу решить это?

0
Khushi 25 Апр 2017 в 08:15

2 ответа

Лучший ответ

Чтобы добавить к ответу Гюнтера Цохбауэра, просто сбросьте также переменную selectedStatus после сброса.

<button (click)="search();form.reset();selectedStatus=[]">search</button>
0
Alok Jha 25 Апр 2017 в 06:36
<div class="form-group" #form="ngForm">

<button (click)="search();form.reset()">search</button>

Пример плунжера

3
Günter Zöchbauer 25 Апр 2017 в 06:18
43602161