equal

function

A converter that is usually for binding to a <input type="radio"> group, so that a scope value can be set the radio group's selected value.

`equal(~compute, value)`

When the getter is called compute, a compute, is compared to value and if they are equal, returns true.

When the setter is called, if the radio is now checked the compute's setter is called with value as the value.

<input type="radio" {($checked)}="equal(~color, 'red')" /> Red
<input type="radio" {($checked)}="equal(~color, 'blue')" /> Blue

In this example, the color scope value will be set to 'red' when the first radio is selected and 'blue' when the second radio is selected.

Parameters

compute {can-compute}:
A compute whose value will be compared to the second argument.
value {*}:
A value of any type, that will be compared to the compute's internal value.

Returns

{can-compute}:

A compute that will be two-way bound to the radio's checked property.

`equal(valueOne, valueTwo)`

When the getter is called the two values will be compared and if they are equal, returns true.

<my-modal {show}="equal(showModal, true)" />

In this example, the show value of my-modal's view model will be set to true when showModal in the scope is set to true.

Parameters

valueOne {*}:
A value of any type, that will be compared to valueTwo.
valueTwo {*}:
A value of any type, that will be compared to valueOne.

Returns

{can-compute}:

A compute that will be one-way bound to the show property.

Use

This converter will most often be used in conjunction with a radio input in order to bind a scope's value (such as string, but could be any value) based on the selection of the radio group.

In this example we are using objects, to select a captain from one of three players:

{{#each players}}
    <input type="radio" {($checked)}="equal(~captain, this)" /> {{name}}
{{/each}}

var template = stache.from("demo");
var vm = new DefineMap({
    captain: null,
    players: [
        { name: "Matthew" },
        { name: "Wilbur" },
        { name: "Anne" }
    ]
});
vm.captain = vm.players[0];

var frag = template(vm);
document.body.appendChild(frag);