Question

我正在努力使用kendo-ui网格外键列和mvvm

我希望能够将"Foreign Key Column" example与"MVVM" example

结合起来

我的问题是：“我如何对查找字段的values属性进行数据绑定？”

Want binding expression for loggerSeverityValues property in my ViewModel

Answer 1

所以这是一篇较老的帖子，但我只是在处理同样的问题并在尝试解决时发现了这个问题。我想回答后人的问题。

＆＃34;价值观＆＃34;在MVVM的kendo网格中，属性似乎不能100％工作。我通过两个步骤解决了这个问题。

Tack＆＃34; this.viewModel＆＃34; （＆＃34; viewModel＆＃34;是您调用VM的任何内容）在＆＃34; loggerSeverityValues＆＃34;前面。这将在编辑字段时为您提供下拉列表。
利用模板功能在网格中显示正确的值。我使用一个小功能来使这更容易：

getText: function (matchValue, valuesArray, text, value)
{
    if (text === undefined)
    {
        text = 'text';
    }

    if (value === undefined)
    {
        value = 'value';
    }

    var retText = "No Value Found";

    finalArr = $.grep(valuesArray, function (val, integer)
    {   
        return val[value] == matchValue;
    });

    if (finalArr.length > 0)
    {
        retText = finalArr[0].text;
    }

    return retText;
}

该领域的最终外观将与此类似：

{ field: 'severity', width: 270, values: this.viewModel.loggerSeverityValues, template: '#: getText(severity, this.viewModel.loggerSeverityValues) #' }

请注意，使用getText（）函数，您可以根据需要覆盖text和value参数。

无论如何这对我有用。有一种解决方法，但是从版本2014.3.1411开始，它似乎没有出现剑道MVVM绑定可以正常使用外键。

编辑：

对于现在使用kendo ng2 +组件的任何人来说，相同的模式，但管道转换工作。

管：

＆＃13;

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({ name: 'getText' })
export class GetTextPipe implements PipeTransform {
    transform(value: any, idPropertyName: string, valuePropertyName: string, valueArray: any[]): any {
        if (value != null && valueArray != undefined) {
            let retIndex = valueArray.map(v => v[idPropertyName]).indexOf(value);
            return valueArray[retIndex][valuePropertyName];
        }
        else {
            return '';
        }
    }
}

＆＃13;

用法：

＆＃13;

<kendo-grid-column field="severity" title="Severity" width="150px">
  <template kendoGridCellTemplate let-dataItem="dataItem">
    {{dataItem.severity | getText:'severity':'severityName':loggerSeverityValues}}
  </template>
</kendo-grid-column>

＆＃13;

kendo-ui grid外键列和mvvm

1 个答案: