结合图像SRC为Ex pression在淘汰赛 [英] Binding Image src as Expression in Knockout

问题描述

请多多包涵，如果你发现这个问题太愚蠢。我是一个初学者到淘汰赛，并努力学习吧。

Please bear with me, if you find this question so stupid. I am a beginner to knockout and trying to learn it.

我要像源绑定到EX pression。这位前pression负责生成路径和路径必须作为源的IMG应用。

I want to bind image source to an expression. The expression is responsible to generate a path and that path must be applied as the Source to the img.

<ul id='AllPatient' data-role='listview' data-inset='true' data-bind="foreach:Patients">
            @*<li><span data-bind="text: ko.toJSON($data)"></span></li>*@
            <li>
                <table class="Tabular">
                    <tr>
                        <td class="DataCell">
                            <a href="javascript:" id="pLocation" sortorder="none"><span data-bind="text:$data.UnitName">
                            </span></a>
                        </td>
                        <td class="DataCellImage">
                            <a href="javascript:" id="addPatient" sortorder="none" data-bind="click:$root.addPatient">
                                <img data-bind="attr:{src: $root.ImageSource}" src="~/Content/Images/MPL/PersonAdd.png" /></a>
                        </td>
                    </tr>
                </table>
            </li>
        </ul>

我使用下面的数据绑定视图模型：

I am using following databinding ViewModel:

function PatientsModel(data)
{
    var self = this;

    self.Patients = ko.observableArray([]);

    self.Patients(data.Patients);
    self.ImageSource = function (model)
    {
        if (model.myPatient == true)
        {
            return PyxisLinkJS.RootURL + '/Content/Images/MPL/MyPatientGray.png';
        }
        else if (model.localPatient == true)
        {
            return PyxisLinkJS.RootURL + '/Content/Images/MPL/PersonAdd.png';
        }
        else
        {
            return PyxisLinkJS.RootURL + '/Content/Images/MPL/MyPatientGray.png';
        }
    }
}

这是发生的事情：它试图ImageSource的函数体设置为SRC的形象。凡为我想触发该方法的ImageSource和返回值设定为图像的src。

This is what happening: It is trying to set function body of ImageSource as the src for the Image. Where as I want to trigger the method ImageSource and set the return value as the Src of the Image.

问候， Sumeet

Regards, Sumeet

推荐答案

它返回的函数，而不是字符串，把它作为函数

It's returning the function instead of the string, call it AS a function

<img data-bind="attr:{src: $root.ImageSource() }" src="~/Content/Images/MPL/PersonAdd.png" />

此外，您还可以结合这两种：

Also, you can combine these two:

self.Patients = ko.observableArray([]);
self.Patients(data.Patients);

// Into this
self.Patients = ko.observableArray( data.Patients );

这篇关于结合图像SRC为Ex pression在淘汰赛的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！