Typescript: allow not-null assertion operator in templates

[dkzlv]

Is your feature request related to a problem? Please describe.
Not-null assertion operator, or simply put, the exclamation mark.

Take this code as an example:

<script lang="typescript">
  export let data: { someKey: string | null };

  let show: boolean;
  $: show = !!data.someKey;
</script>

{#if show}
  {data.someKey.toUpperCase()}
{/if}

I have done external checks and I am pretty sure someKey cannot be null, but TS would not compile it, because Object is possibly 'null'.. It would be very handy to write data.someKey!.toUpperCase(), but currently it is not possible.

Describe the solution you'd like

• support the operator would be the best option
• add the possibility of ignoring the following line in Typescript (@ts-ignore in html comment). It may be a separate feature request as well

Describe alternatives you've considered
For now I see no other alternatives. The only one is to have excessive checks in {#if} tags.

[dummdidumm]

Oh this is a tough one. The problem is that at the moment mustache tags are not preprocessed, so you cannot use anything other than basic JavaScript in there. There is an issue about this in the main repo sveltejs/svelte#4701 . Your proposal about @ts-ignore could work but feels very hacky, not sure about that. Do others have opinions on this?

[jasonlyu123]

tsignore would probably not work as intended sometimes.
Also, I think there are a lot of workaround for situation that you have to use typescript in template. In many cases it could be done in script instead.

[dummdidumm]

I feel the same. I'm going to close this then. It seems like template/mustache preprocessing is being worked on soon, so let's wait and use workarounds in the meantime. Sorry @dkzlv that we cannot fix this right now.