Question

我在我的angular 7应用程序中实现了大约6个kendo下拉控件，该控件最初正在工作，但现在突然停止工作。控制标记在我看来还不错。我还可以看到包含值的下拉列表的集合。不知道为什么我所有的值都没有绑定到控件。控件中仅显示与ID匹配的值。控件确实在选择时打开，并且在检查元素时看不到其余的值。我需要在将数据绑定到控件之前创建一个原始列表，然后在用户选择时将原始列表重新绑定到控件吗？我也看不到任何错误。

一个下拉控件（FundDetails.InvestmentStatuses）的数据

[{
    "RANK_ORDER":20,
    "NAME":"Illiquid",
    "IS_ACTIVE":true,
    "SORT_ORDER":20,
    "ID":134,
    "DATE_CREATED":"2018-06-13T09:07:09",
    "LAST_MODIFIED":"2018-06-13T09:07:09",
    "CREATED_BY_ID":96,
    "LAST_MODIFIED_BY_ID":96
}, {
    "RANK_ORDER":1,
    "NAME":"Invested",
    "IS_ACTIVE":true,
    "SORT_ORDER":1,
    "ID":1,
    "DATE_CREATED":"2014-02-04T12:50:20",
    "LAST_MODIFIED":"2014-10-23T22:56:37",
    "CREATED_BY_ID":52,
    "LAST_MODIFIED_BY_ID":338
}, {
    "RANK_ORDER":9,
    "NAME":"Not Evaluated",
    "IS_ACTIVE":true,
    "SORT_ORDER":4,
    "ID":9,
    "DATE_CREATED":"2014-02-12T10:10:39",
    "LAST_MODIFIED":"2018-08-22T10:49:48",
    "CREATED_BY_ID":52,
    "LAST_MODIFIED_BY_ID":96
}, {
    "RANK_ORDER":4,
    "NAME":"Prospective",
    "IS_ACTIVE":true,
    "SORT_ORDER":3,
    "ID":6,
    "DATE_CREATED":"2014-02-04T12:50:20",
    "LAST_MODIFIED":"2018-08-22T10:49:50",
    "CREATED_BY_ID":52,
    "LAST_MODIFIED_BY_ID":96
}, {
    "RANK_ORDER":8,
    "NAME":"Prospective - Inactive",
    "IS_ACTIVE":true,
    "SORT_ORDER":7,
    "ID":8,
    "DATE_CREATED":"2014-02-04T12:50:20",
    "LAST_MODIFIED":"2018-08-22T10:49:50",
    "CREATED_BY_ID":52,
    "LAST_MODIFIED_BY_ID":96
}, {
    "RANK_ORDER":7,
    "NAME":"Redeemed",
    "IS_ACTIVE":true,
    "SORT_ORDER":11,
    "ID":106,
    "DATE_CREATED":"2014-09-09T18:51:12",
    "LAST_MODIFIED":"2014-10-23T22:56:38",
    "CREATED_BY_ID":338,
    "LAST_MODIFIED_BY_ID":338
}, {
    "RANK_ORDER":2,
    "NAME":"Redeeming",
    "IS_ACTIVE":true,
    "SORT_ORDER":5,
    "ID":4,
    "DATE_CREATED":"2014-02-04T12:50:20",
    "LAST_MODIFIED":"2014-10-23T22:56:37",
    "CREATED_BY_ID":52,
    "LAST_MODIFIED_BY_ID":338
}]

标记

      <label for="inputOffice" class="col-md-2 col-form-label ">Investment Status</label>
      <div class="col-md-4">
        <div *ngIf="!EditMode">{{FundDetails?.InvestmentStatusName}}</div>
           <kendo-dropdownlist *ngIf="EditMode" style="width:100%" [(ngModel)]="FundDetails.InvestmentStatusId"
                        class="form-control form-control-sm" [data]="FundDetails.InvestmentStatuses"
                        [filterable]="false" textField="NAME" [valuePrimitive]="true" valueField="ID">
          </kendo-dropdownlist>
       </div>
     </div>

组件代码

getFundDetails(selectedFundId: number) {
        // Initialize fundid to 0 to test new fund
        // selectedFundId = 0;

        if (selectedFundId != null) {
            this.fundService.getFundDetails(selectedFundId).subscribe((data: IFund[]) => {
                // data.forEach((d) => {d.InceptionDate = new Date(d.InceptionDate); });
                this.FundDetails = data;
                this.OriginalFundStrategiesList = this.FundDetails.FundStrategies;
                this.SelectedFundId = this.FundDetails.FundId;

                // if ( this.SelectedFundId === 0) {
                //     this.resetForm();
                // }
            });
        }
    }

接口

export interface IFund {
    FundId: number;
    FundName: string;
    IsAnonymous: boolean;
    BloombergTicker: string;
    InvestmentStatusId: number;
    InvestmentStatusName: string;
    FlagShipFundId: number;
    InceptionDate: Date;
    AccountMandateId: number;
    AccountMandateName: string;
    VehicleTypeId: number;
    VehicleTypeName: string;
    PrimaryClassId: number;
    PrimaryClassDescripton: string;
}

我什至尝试使用剑道下拉菜单的本机属性，但是没有运气

 <kendo-dropdownlist  k-ng-model="FundDetails.VehicleTypeId"
                    k-data-text-field="'NAME'"
                    k-value-primitive="true"                
                    k-data-value-field="ID"
                    k-data-source="FundDetails.VehicleTypes">

                </kendo-dropdownlist>

最新更新是，我注释掉了所有下拉框，并在屏幕上只剩下一个。我可以看到下拉渲染，但它位于UI的后面。因此，我了解的是值已正确绑定，但由于某种原因隐藏在UI中

Answer 1

问题已经解决，因为我的CSS类是罪魁祸首。

// z-index：10050！important;

kendo UI下拉控件未显示集合中的所有值

1 个答案: