Property binding like
[trueValue]="..."
evaluates the expression "..."
and assigns the value
"true"
evaluates to the value true
"Y"
is unknown. There is no internal Y
value in TypeScript and no property in the component class instance, which is the scope of template binding.
In this case you would want
[trueValue]="'Y'"
Note the additional quotes to make Y
a string.
Plain attributes are also assigned to inputs
trueValue="Y"
is plain HTML without any Angular2 binding and attribute values are always strings. Therefore this would assign the string Y
.
Another way is string interpolation
trueValue="{{true}}"
would assign the value "true"
(as string) because the expression withing {{...}}
would be evaluated and then converted to a string before passed to the input.
This can’t be used to bind other values than strings.
To explicitly bind to an attribute instead of a property you can use
(besides trueValue="Y"
which creates an attribute but doesn’t do any evaluation)
[attr.trueValue]="'Y'"
or
attr.trueValue="{{'Y'}}"
Attribute binding is helpful if you want to use the trueValue
attribute to address the element with CSS selectors.