0

I have an igCombo in durandal project. I load the igCombo through the date-bind property at the dom. I created an itemTemplate for the select element options. I want that where I select any item, the combo's input will show the selectedItem template. Here is my code, but it doesn't work well; it shows in the inpute the follow thing:

[object object]

here is my code:

    <span id="combo" data-bind="igCombo: {   dataSource: data, textKey: 'name',
                            valueKey: 'id', width: '400px',
                            itemTemplate: '${name} | ${id}',
                            allowCustomValue: true,
                            selectionChanged: function (evt, ui) {
                                var concatenatedValue = ui.items.template
                                ui.owner.text(concatenatedValue);}        
                            }">
    </span>

(Please don't answer me that I can simply write in the selectionChanged function the sane piece of code that I wrote in the itemTemplate property, becouse now it is small piece of code, but when it will be longer code- it is not nice to write it twice!!!)

can you help me?

4

1 回答 1

1

我可以尝试解释为什么组合输入不会故意使用 itemTemplate - 该模板主要是丰富的 HTML 内容（图像、链接和诸如本示例http://www.infragistics.com/products/jquery/中的其他内容） sample/combo-box/template ) 并且您不能将其放在输入字段中。

但是，在您的情况下，您只是使用文本，所以它是可行的 - 首先提供给事件的 ui.items （顾名思义）是一个集合，所以取第一个并且项目没有模板属性，除非是我看不到的模型的一部分。

与其他 Ignite UI 控件一样，Combo 使用模板引擎，您也可以！从控件中获取 itemTemplate 并从数据源中获取项目，如下所示：

function (evt, ui) {
    var templatedValue = $.ig.tmpl(ui.owner.options.itemTemplate, ui.owner.options.dataSource[ui.items[0].index]);

    ui.owner.text(templatedValue);
}

JSFiddle：http: //jsfiddle.net/damyanpetev/tB7Ds/

如果您熟悉的话，模板 API 很像旧的 jQUery 模板 - 获取模板，然后是数据对象。使用来自控件本身的值意味着您可以根据需要使它们变得复杂，并且只在一个地方编写它们，这段代码根本不需要改变。

于 2013-10-07T16:31:59.507 回答