Question

我正在使用angular 8，安装了ng-autocomplete，它的工作方式如下：

HTML：

<div class="field">
       <label class="label">Nombre del condominio:</label>
        <div class="control">
          <div class="input is-small is-fullwidth">

            <ng-autocomplete

              [(ngModel)]="condos.conName"
              [data]="condominiums"
              [searchKeyword]="keyword"
              (selected)='selectEvent($event)'
              (inputChanged)='onChangeSearch($event)'
              (inputFocused)='onFocused($event)'
              (inputCleared)='onCleared()'
              [itemTemplate]="itemTemplate"
              [notFoundTemplate]="notFoundTemplate">
            </ng-autocomplete>

            <ng-template #itemTemplate let-item>
              <a [innerHTML]="item.conName"></a>
            </ng-template>

            <ng-template #notFoundTemplate let-notFound>
              <div [innerHTML]="notFound"></div>
            </ng-template>
          </div>
        </div>
      </div>

但是给我发送ng-autocomplete错误：

错误错误：如果在表单标签中使用ngModel，则名称必须设置属性或表单控件必须在ngModelOptions中定义为“独立”。
  Example 1: <input [(ngModel)]="person.firstName" name="first">
  Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">

如果我使用这样的选项（我都尝试过）：

<ng-autocomplete
  name="ConName"
  [(ngModel)]="condos.conName"
  [data]="condominiums"
  [searchKeyword]="keyword"
  (selected)='selectEvent($event)'
  (inputChanged)='onChangeSearch($event)'
  (inputFocused)='onFocused($event)'
  (inputCleared)='onCleared()'
  [itemTemplate]="itemTemplate"
  [notFoundTemplate]="notFoundTemplate">
</ng-autocomplete>

没有错误，但是自动完成功能不再起作用，它不会下拉。

任何想法??????

谢谢

Answer 1

 <ng-autocomplete 
      [data]="locationList" 
      [searchKeyword]="keyword"
      (selected)='selectEvent($event)'
      (inputChanged)='onChangeSearch($event)' 
      (inputFocused)='onFocused($event)' 
      [itemTemplate]="itemTemplate"
      [notFoundTemplate]="notFoundTemplate"
      [(ngModel)]= userLocation.name
      placeHolder="Search Location">
 </ng-autocomplete>
    <ng-template #itemTemplate let-item>
      <a [innerHTML]="item.name"></a>
    </ng-template>
    <ng-template #notFoundTemplate let-notFound>
      <div [innerHTML]="notFound"></div>
    </ng-template>

[（ngModel）] = userLocation.name

--------------在我的.ts文件中---------------------------- ------

userLocation : any = {  id: 1, name : 'INDORE'}

LocationList = [{"id":1,"name":"INDORE"},{"id":2,"name":"UJJAIN"},{"id":3,"name":"AHMEDABAD"},{"id":4,"name":"UDAIPUR"}]`

使用ngModel还显示具有绑定值的自动填充值

角ng自动完成不起作用[[ngModel）]和名称一起

1 个答案: