如何使select2与Angular 7配合使用

我试图在我的Angular 7项目中实现Select 2。我遵循从github实现的所有过程。但它仍然不起作用。当我向其中呈现一些静态数据时，它就会工作。它不会从Web服务器填充数据。请分享你的想法。下面是我的代码

Html代码：

  <select2 [options]="areas" [settings]="{ width: '100%' }"></select2>

  <div *ngFor="let ar of areas">
    <p>{{ar.Area_Name}}</p>
  </div>

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { ObjectAreas } from './areasObject';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: [
    './app.component.css',
    '../../node_modules/bootstrap/dist/css/bootstrap.min.css'
  ]
})
export class AppComponent 
{  
  apiURL: string = 'http://localhost/support/php/getAreas.php?areasno=0';

  constructor(private httpClient: HttpClient) { }

  areas: ObjectAreas;

  public getContacts()
  {
    return this.httpClient.get(this.apiURL);
  }

  ngOnInit()
  {
    this.getContacts()
      .subscribe((res:ObjectLoan)=>
        {      
          this.areas  = res;                           
        });              
  }

}

型号类别：

export class ObjectAreas
{
    AreaSno: number;
    Area_Code: string;
    Area_Name: string;
}

我在控制台中遇到此错误：

TypeError: Cannot read property 'toString' of undefined

---

您需要使用

ng2-select2

library

尝试按照此处演示的方式使用它

同时，在数据属性中保留

区域

，而不是选项

<select2 [data]="areas" ></select2>

Seeu更新了ngOnit函数，该函数接受res对象并创建一个包含所有标题的数组

  ngOnInit()
  {
    this.getContacts()
      .subscribe((res:any)=>
        {      
             console.log(res)
             var arr = [];

             for(var i=0; i<res.length; i++) {
                var x = res[i].title ;
                arr.push(x);
             }
            //console.log(arr)
            this.users  =  arr;
        });      

  }

ngOnInit（）
{
这个文件名为getContacts（）
.订阅（（res:any）=>
{      
console.log（res）
var-arr=[]；
对于（var i=0；i它接受特定格式的数据，如

[
    {
        id: 'uniqe_id',
        text: 'text_to_display'
    }
]

您必须首先将数据转换为这种格式。
相反，ObjectLoan使用ObjectAreas，它应该仅使用ObjectAreas数组来遍历EAM。我在这里键入的是错误的。请将其设置为类似ObjectAreas的数组[]并确保从web服务中获取对象数组I使其数组与之相似。但不获取。I从web服务中获取对象。我已在下面的html中显示了它们。因此，除非从服务中获取数组，否则它将无法工作I更改为此。areas=[res]；//转换为数组。。但在html中，我只获取了[对象对象，对象对象]而不是值…你能在stackblitz或plunker上复制它，并添加链接以检查问题所在。我不认为这是。区域=[res]；是正确的方法吗？请告诉我你的res对象的结构好吗？请看更新的tsackblitz。我会调查一下，如果我发现了什么，会告诉你的