如何在异步调用中使用敲除和typescript设置select的值

how to setup value of select using knockout and typescript on async call

本文关键字：typescript 设置 的值 select 异步 调用      更新时间：2023-09-26

我的视图模型代码如下所示。

export class viewModel {
providers: KnockoutObservableArray<PatientProviderModule.ProviderList>;
selectedProvider: KnockoutObservable<PatientProviderModule.ProviderList>;
billingService: BillingService;

patientProviderInfo: KnockoutObservableArray<PatientProviderModel>;
constructor(selectedProvider: number) {
    this.providers = ko.observableArray<PatientProviderModule.ProviderList>();
    this.billingService = new BillingService();
    this.patientProviderInfo = ko.observableArray<PatientProviderModel>();
    this.loadData();
    this.selectedProvider = "what should come here?";
}
loadData = () => {
    this.billingService.getPatientAndProviderInfo().then((data: PatientProviderModel) => {
        this.providers.pushAll(data.ProviderList);
        this.selectedProvider = ko.observable(this.providers()[2]);
    });
}

}

在html方面，它是这样绑定的。

    <select data-bind="options: providers, value: selectedProvider,  optionsCaption: '', optionsValue: 'prov_id', optionsText: 'FullName'"></select>

loadData函数填充"providers"中的下拉数据。在填充之后，我试图在下拉列表中选择最后一个选项。但是它没有选择任何选项。请帮忙。

您正在loadData中将selectedProvider异步设置为可观察的。这意味着，在UI绑定到模型时，该字段还不是Observable，因此不知道要查找更改事件。您应该立即在构造函数中将selectedProvider实例化为新的可观察对象，然后更新loadData中现有可观察对象的值。

设置构造函数

 this.selectedProvider = ko.observable();

和负载功能

this.selectedProvider(this.providers()[2].prov_id);

成功了！！

相关文章：