Question

所以我正在尝试一个新的（对我来说）自动完成器： https://github.com/oferh/ng2-completer。导入它，一切正常。：

现在，我想在选择项目时获取所选的项目值：

<ng2-completer [(ngModel)]="searchStr" 
[inputClass]="'form-control form-control-inline'"  [datasource]="getSelectedItemArray?" 
[minSearchLength]="0"></ng2-completer>

选择：

 protected searchData = [
    { name: 'Bus UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'Next UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'Lus UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'Mamama UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'Cars UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'Trailers UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'Busses UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'UKUK UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'MAIN UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
    { name: 'LustKK UK LTD', address: 'Example', address2: 'Example2',
      pscode: '8497UK', ccode: '877SAD', veh1: '84A4DA', veh2: '846ASD', trail1: '486XSS', trail2: '8746SS' },
  ];


  constructor(private completerService: CompleterService) {
    this.dataService = completerService.local(this.searchData, 'name', 'name');
  }

结束语-我从列表中选择一个项目-它成为输入值，然后我要获取所有选定的项目值（名称，地址，地址1...。）。我该如何达到目标？

Answer 1

该值必须在模型searchStr

中

更新

将此添加到您的HTML

(selected)="onItemSelected($event)"

您的ts中：

onCountrySelected(selected: CompleterItem) {
        if (selected) {
             console.log(selected.title);
           }       
    }

Angular 2 ng2-completer获取选定的项目值

1 个答案: