Way to use signal in template expression?

Question

Let say I have

interface Point {
  x:number;
  y:number;
}

@Component(...)
class PointComponent {
  point = signal<Point>({x:0, y:0});
}

Now I can do this in template

@if(point(); as point) {
  <pre> x: {{point.x}}, y: {{point.y}} </pre>
}

But I have used @if as auxiliary control flow block because I can't to introduce template variable other way.

Of course I can do this

<pre> x: {{point().x}}, y: {{point().y}} </pre>

But is there some way to introduce template variable to do it concisely?

Answer 1

With the latest version of Angular, you can now use the @let syntax:

@let _point = point();
<pre> x: {{ _point.x }}, y: {{ _point.y }} </pre>

It currently doesn't support naming the variable the same as the field, so you have to be creative here.