angular4 提及输入标签无法正常工作

问题描述 投票:0回答:1

我正在使用 Angular 4 提及标签输入。我创建了一个 api,可以获取所有用户列表,但我无法在角度提及列表中显示它。我很困惑该怎么办。需要帮助。

HTML

<input contenteditable="true" class="publisher-input" type="text" 
       id="comment" formControlName="comment" 
       placeholder="Add Your Comment" [mention]="userList" 
       [mentionConfig]="{triggerChar:'@',maxItems:10}" (searchTerm)="showUsers()">

TS

userList: String[] = [];

ngOnInit() {
  this.loadUsers();
}

loadUsers() {
  this.asd.getUsers().subscribe(results => {
    results['success'].forEach(element => {
      if (element.firstName && element.middleName && element.lastName) {
        // tslint:disable-next-line:no-construct
        this.userList.push(element.firstName + ' ' + element.middleName 
                           + ' ' + element.lastName);
      }
      if (!element.firstName) {
        // tslint:disable-next-line:no-construct
        this.userList.push(element.middleName + ' ' + element.lastName);
      }
      if (!element.middleName) {
        // tslint:disable-next-line:no-construct
        this.userList.push(element.firstName + ' ' + element.lastName);
      }
      if (!element.lastName) {
        // tslint:disable-next-line:no-construct
        this.userList.push(element.firstName + ' ' + element.middleName);
      }
    });
  });
}

showUsers() {
  this.loadUsers();
}

我已经使用了这个包https://github.com/dmacfarlane/angular-mentions。但无法正确获取数据。

angular tags mention mentionsinput.js
1个回答
0
投票

您必须将 searchTerm 放入 [mentionConfig] 中才能使其正常工作

<input type="text" [mention]="userList" [mentionConfig]= {triggerChar:'@',mentionSelect:formatMention,maxItems:10,labelKey:'name',disableSearch:false}" name="text" id="text">
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.