Kendo Dropdown with Angular 4

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

我在尝试使用Kendo UI为角度4向下拉列表中显示数据时遇到问题。我在这里有一些事情,如果我能看到我出错的地方,那将会很有帮助。

首先,我有一个api调用,它返回一个“name”和“number”列表,例如:

{
"name": "Fun Company",
"number": 9
},
{
"name": "Sad Company",
"number": 10
},

我的服务看起来像

@Injectable()
export class MembersListService {
  constructor(private http: Http) { }

  getMembersList(): Observable<MemembersList> {
    return this.http.get('Filtering/Members')
      .map(response => <MemembersList>response.json());
  }
}

我的组件

@Component({
  selector: 'foo'
  templateUrl: './foo.component.html',
})
export class fooComponent implements OnInit {
  getMembersList: MemembersList;
  constructor(
    private title: Title,
    private membersListService: MembersListService,
  ) {
    // page title
    this.title.setTitle('FooCompany| Foo Page');
   }

  ngOnInit() {

    // Member List
    this.getMembersList = new MemembersList();
    this.membersListService.getMembersList().subscribe(res => this.getMembersList = res);            
  }    
}

MemberList类是

export class MemembersList{
  name: string;
  number: number;
}

HTML看起来像

      <kendo-dropdownlist
        [data]="getMembersList"
        textField="name"
        valueField="number"
        [valuePrimitive]="true"
      >
      </kendo-dropdownlist>
angular kendo-ui kendo-ui-angular2
1个回答
0
投票

Kendo Dropdownlist需要一个对象数组或原始数据(数据属性)

你的getMembersList成员变量是一个单独的对象。将它转换为MembersList数组,它应该没问题

Data Binding in Kendo DropDown list

© www.soinside.com 2019 - 2024. All rights reserved.