[Angular 17] Change to use new control flow syntax

[mraible]

---

Please make sure the below checklist is followed for Pull Requests.

• All continuous integration tests are green
• Tests are added where necessary
• The JDL part is updated if necessary
• jhipster-online is updated if necessary
• Documentation is added/updated where necessary
• Coding Rules & Commit Guidelines as per our CONTRIBUTING.md document are followed

[qmonmert]

control flow is in developer preview, it's too early no?
https://angular.io/guide/control_flow

[mraible]

@qmonmert I was not aware it's only in developer preview. Thanks for the heads up!

[mshima]

Me neither.
According to https://blog.angular.io/introducing-angular-v17-4d7033312e4b, control flow will be on developer preview until v18.

There are still some differences between how the built-in control flow handles content projection compared to *ngIf, *ngFor, and *ngSwitch, and we’ll be working on them over the next months. Aside from that, we’re confident in the implementation and stability of the built-in control flow so you can give it a try today! We’d like to keep it under developer preview until the next major release so that we can open the door for potential backward incompatible fixes in case we find opportunities to further enhance developer experience.

v18 is 6 months away.
Since @mraible already started working on it and we’re confident in the implementation and stability of the built-in control flow so you can give it a try today!, if the team decides to use it I am ok with it.

[mraible]

This expression in password.component.html.ejs doesn't work:

@if (account$ | async as account) {

Error:

Property 'account' does not exist on type 'PasswordComponent'. Did you mean 'account$'?

5         <h2 jhiTranslate="password.title" [translateValues]="{ username: account.login }">

[mshima]

ng-bootstrap is already using new control flow.