Allow only value types in string interpolations

[zakjan]

export class PageViewModel {
    item: {name: string};
}

<template>
    <!-- fail -->
    ${item}
    <div title="Item: ${item}"></div>
    <!-- ok -->
    ${item.name}
    <div title="Item: ${item.name}"></div>
</template>

It could prevent unintentional implicit casting, for example to "[object Object]".

[MeirionHughes]

if the class definition has a toString() then that should be okay too.

Might need to add in some functionality in the reflection to traverse through the extended classes to see if toString() is overridden in the class graph.

[zakjan]

The default JS behavior for template strings is to always call ToString(result of evaluating expression) https://tc39.github.io/ecma262/#sec-template-literals-runtime-semantics-evaluation Implementing a logic that would allow only non-native toString could be confusing.

TypeScript itself doesn't want different rules of template strings and + operator. See microsoft/TypeScript#7989 and linked issues

I can see two possible solutions. 1) implement an optional strict rule that would allow strings only, everything else would need to be explicitly casted with .toString() 2) follow how TypeScript currently does this, i.e. don't implement this rule at all

[MeirionHughes]

I think I'm leaning to the later; technically its is not syntactically incorrect to do this. So long as the access expression to the variable is correct and assignment is okay. Then I think anything else is currently out-of-scope.

[MeirionHughes]

I think if anyone actually did print off an object like above then they will clearly see the result and given it is technically not-incorrect to do so, I won't be spending time on it yet.