Question

我在我的离子项目上安装了primeng以便能够使用自动完成功能，我遵循了所有建议，但仍然出现错误：

错误：模板解析错误：因为它无法绑定到“建议” 不是'p-autoComplete'的已知属性。 1.如果“ p-autoComplete”是一个Angular组件，并且具有“建议”输入，则请验证它是否是此模块的一部分。 2.如果“ p-autoComplete”是Web组件，则将“ CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“ @ NgModule.schemas” 禁止显示此消息。

注意到我已经这样做了：

npm install primeng --save
npm install primeicons --save

我的app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import {AutoCompleteModule} from 'primeng/autocomplete';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  // tslint:disable-next-line: max-line-length
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, HttpModule, HttpClientModule,
     AutoCompleteModule, BrowserAnimationsModule, MultiSelectModule],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent],
  schemas:
        [CUSTOM_ELEMENTS_SCHEMA]
})

angular.json中的样式配置

"styles": [
                "node_modules/primeicons/primeicons.css",
                "node_modules/primeng/resources/themes/nova-light/theme.css",
                "node_modules/primeng/resources/primeng.min.css",
              {
                "input": "src/theme/variables.scss" 
              },
              {
                "input": "src/global.scss"
              }
            ]

我的HTML

<ion-content>

  <h3>Liste des Docteurs</h3>
<span class="ui-fluid">
    <p-autoComplete [(ngModel)]="medecins" [suggestions]="filteredMedecinsMultiple" (completeMethod)="filterMedecinMultiple($event)" styleClass="wid100"
        [minLength]="1" placeholder="Médecins" field="name" [multiple]="true">
    </p-autoComplete>
</span>


</ion-content>

我的Ts组件

import { Component, OnInit } from '@angular/core';
import { MedecinService } from '../medecin.service';

@Component({
  selector: 'app-search',
  templateUrl: './search.page.html',
  styleUrls: ['./search.page.scss'],
})
export class SearchPage implements OnInit {
    medecin: any;

    medecins: any[];
    filteredMedecinsMultiple: any[];

  constructor(private medecinService: MedecinService) { }

  filterMedecinMultiple(event) {
    const query = event.query;
    this.medecinService.getMedecins().toPromise().then(medecins => {
        this.filteredMedecinsMultiple = this.filterMedecin(query, this.medecins);
    });
}

filterMedecin(query, medecins: any[]): any[] {
  const filtered: any[] = [];
  for (let i = 0; i < medecins.length; i++) {
      const medecin = this.medecins[i];
      if (medecin.name.toLowerCase().indexOf(query.toLowerCase()) === 0) {
          filtered.push(medecin);
      }
  }
  return filtered;
}
```
Thanks

错误：无法绑定到“建议”，因为它不是“ p-autoComplete” PRIMENG的已知属性

0 个答案: