Kendo Multiselect не показывает ранее выбранные элементы

Question

Я пытаюсь заполнить управление множественным выбором кендо.Данные привязываются к элементу управления, и я могу видеть все валюты из объекта валют, но он показывает ранее выбранные валюты, которые есть в ngmodel.Как показать выбранные валюты?

                    <kendo-multiselect [data]="LegalFundClasses.Currencies" style="height: 29.5px;"
                            [(ngModel)]="f.OtherCurrencyName" [textField]="'Name'" [valueField]="'Id'"
                            [autoClose]="false">
                            <ng-template kendoMultiSelectItemTemplate let-dataItem>
                                <input type="checkbox" class="k-checkbox" [checked]="isItemSelected(dataItem.Name)">
                                <label class="k-checkbox-label">{{ dataItem.Name }}</label>
                            </ng-template>
                    </kendo-multiselect>

Компонент

public value: any = [{ Id: null, Name: "" }];

public isItemSelected(itemText: string): boolean {
    return this.value.some(item => item.Name === itemText);
}

Объект Валюты

 "Currencies": [
            {
                "Id": 7,
                "Name": "AUD"
            },
            {
                "Id": 10,
                "Name": "BND"
            },
            {
                "Id": 19,
                "Name": "BRL"
            },
            {
                "Id": 6,
                "Name": "CAD"
            },
            {
                "Id": 5,
                "Name": "CHF"
            },
            {
                "Id": 13,
                "Name": "CNH"
            },
            {
                "Id": 12,
                "Name": "CNY"
            },
            {
                "Id": 18,
                "Name": "DKK"
            },
            {
                "Id": 3,
                "Name": "EUR"
            }]

NgModel

Имя f.OtherCurrencyName, котороев ngModel содержит строковое значение 10,19,7, разделенное запятой.

Редактировать 1

Снимок экрана

введите описание изображения здесь

Код

 <td *ngIf="EditMode[f.LegalFundClassCommercialViewModel.Id] && c == 'Other Currencies'"
                                    class="tableItem">

                                    <!-- f.LegalFundClassCommercialViewModel.OtherCurrencyName -->
                                    <kendo-multiselect [data]="LegalFundClasses.Currencies" style="height: 29.5px;"
                                        [(ngModel)]="f.LegalFundClassCommercialViewModel.OtherCurrencyName"
                                        [textField]="'Name'" [valueField]="'Id'" [autoClose]="false">
                                        <ng-template kendoMultiSelectItemTemplate let-dataItem>
                                            <input type="checkbox" class="k-checkbox"
                                                [checked]="isItemSelected(dataItem.Name)">
                                            <label class="k-checkbox-label">{{ dataItem.Name }}</label>
                                        </ng-template>
                                    </kendo-multiselect>

                                </td>




public value: any = [];

public valueChange(value: any): void {
   // this.OtherCurrencyName = value.map(x => x.Id).join();
  }

public isItemSelected(itemName: string): boolean {
    return this.value.some(item => item.Name === itemName);
  }

OtherCurrencyName

 "LegalFundClassCommercialViewModel": {
                    "Description": "Class A",
                    "AuditSummary": "rmenon Jun 10, 2019",
                    "FeesReviewSummary": "dmukerji May 28, 2019",
                    "TermsReviewSummary": "kweigand Jan 16, 2019",
                    "Id": 13713,
                    "FundId": 237146,
                    "FundClassType": 3,
                    "CurrencyId": 19,
                    "PrimaryCurrencyName": "BRL",
                    "OtherCurrencyName": [
                        10,
                        19,
                        7
                    ]
}

Валютный объект

 "Currencies": [
            {
                "Id": 7,
                "Name": "AUD"
            },
            {
                "Id": 10,
                "Name": "BND"
            },
            {
                "Id": 19,
                "Name": "BRL"
            },
            {
                "Id": 6,
                "Name": "CAD"
            }]

Answer 1

Я думаю, вы должны использовать этот код:

<div class="example-wrapper">
  <kendo-multiselect
    [data]="listItems"
    [(ngModel)]="value"
    [textField]="'name'"
    [valueField]="'Id'"
    [autoClose]="false"
  >
  <ng-template kendoMultiSelectItemTemplate let-dataItem>
    <input type="checkbox" class="k-checkbox"
      [checked]="isItemSelected(dataItem.name)">
    <label class="k-checkbox-label">{{ dataItem.name }}</label>
  </ng-template>
  </kendo-multiselect>
</div>

и для файла ts:

class AppComponent {
   public listItems: Array<{ name: string, Id: number }> = [
      { name: "AUD", Id: 1 },
      { name: "BRL", Id: 2 },        
      { name: "BND", Id: 3 },
      { name: "DKK", Id: 4 },
      { name: "EUR", Id: 5 }
   ];        
   public value: any = [{ name: "BRL", Id: 2 }];

   public isItemSelected(itemName: string): boolean {
      return this.value.some(item => item.name === itemName);
   }
 }