1

i am working with angular 4 mention tag input. I have created a api that is getting me all users list but i am not able to show it in angular mention list. I am confused what to do. Need help.

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();
}

I have used this package https://github.com/dmacfarlane/angular-mentions. But not getting the data properly.

Stefan Falk
  • 23,898
  • 50
  • 191
  • 378
Raj kumar
  • 75
  • 2
  • 15

1 Answers1

0

You have to put the searchTerm inside the [mentionConfig] to make it work

<input type="text" [mention]="userList" [mentionConfig]= {triggerChar:'@',mentionSelect:formatMention,maxItems:10,labelKey:'name',disableSearch:false}" name="text" id="text">
Francis
  • 1