binding to the src of an image

[JDeville]

Is there an easy way to bind to the src attribute of an image? I
don't see a binding for it. I suppose I could create a template for
it, but that seems like overkill.

Does anyone have a generic binding that will just let me pick the name
of the attribute I want to set, and then set it? So far, the bindings
have felt kinda restrictive.

[JDeville]

I wrote a custom binding that is generic. It will set any attribute.
In my case, I'm using it to set the src of an image, so I'd use it
like this:

<img data-bind("attr: image_source, name:'src'")

ko.bindingHandlers.attr = {
update: (element, valueAccessor, allBindings) ->
$(element).attr(allBindings().name, valueAccessor())
}

If there's a better way to do that, please let me know. If not,
perhaps it could be included in a future release?

[green]

By using https://github.com/greenlaw110/knockout-ext, you could do this: <img data-bind="attr: {src: myimage}"></img>. E.g. http://jsfiddle.net/greenlaw110/uKseh/1/

[JDeville]

Nice! Thanks green!

On Jan 26, 6:06 pm, green <greenlaw...@gmail.com> wrote:
> By usinghttps://github.com/greenlaw110/knockout-ext, you could do this:
> <img data-bind="attr: {src: myimage}"></img>. E.g.http://jsfiddle.net/greenlaw110/uKseh/1/

[Steven Sanderson]

Hey, that's really cool! Green, would you be happy for me to put your "attr" binding in KO core? It looks ideal.

Thanks

Steve

[mcoolin]

That would be a nice addition.

On Jan 27, 3:30 am, Steven Sanderson <st...@codeville.net> wrote:
> Hey, that's really cool! Green, would you be happy for me to put your "attr"
> binding in KO core? It looks ideal.
>
> Thanks
> Steve
>

[green]

Sure. Probably you also want to put event binding from KO-ext into KO core. 

[TurboRSV]

What if the value of 'myimage' is undefined at runtime?
Hoe can we manage this? I just came across this problem. Can the 'if' binding be put to work here? How?

[Casey Corcoran]

Looks like you've resurrected a really old post... Are you using the built in "attr" binding or the custom one mentioned in the thread?

I'll typically use "if" in a ko comment for a scenario like that:

<!-- ko if: myimage -->

<img data-bind="attr:{src:myimage}"/>

<!-- /ko -->

Casey Corcoran

casey.c...@gmail.com

[Mark D'Arensbourg]

It's hacky but you can save a few bytes by using //:0 as a placeholder src attribute on your img.