Update to Angular 4 (phase 1) #768

New Issue

fergalmoran · 2025-08-09T17:17:36Z

fergalmoran commented

2025-08-09 17:17:36 +00:00

Originally created by @SteveSandersonMS on 5/11/2017

As per this comment, this is a first step towards updating to Angular 4. It's an attempt at the minimal changes needed to get Angular 4 working correctly on both client and server.

I've pushed a prerelease version of generator-aspnetcore-spa to NPM so that people can try this out (details below). I'd like to get a pretty substantial level of feedback that this works properly in all the existing scenarios before we merge this into dev and ship it as the released template package.

How to try it

Install the prerelease version of the Yeoman generator:

npm install -g generator-aspnetcore-spa@next

(having already installed Yeoman using npm install -g yo if you don't already have it)

... and then create a new project:

yo aspnetcore-spa

Please tell us how you get on with it.

Notes

There are a couple of implementation details I'm not yet totally happy with:

In boot-server.ts, the error handling is messy. Because Angular fires onStable before it fires onError, I've had to use a nasty setImmediate hack to wait for possible errors before rendering the page. This doesn't feel like it should be the right solution. However, I've looked for examples of people using platformDynamicServer across the web, and it seems like virtually nobody is using it yet, there are no official samples, and the few examples I can find don't even make any attempt at error handling at all. So, @MarkPieszak, is the event ordering a bug in Angular, or is there some other way we're meant to catch errors?
The ORIGIN_URL token is just a string right now. It would be better if we had an actual class like RequestContext so you could have component constructor parameters like context: RequestContext without having to use the @Inject decorator at all. But when I tried to do that, it didn't work because the code evaluates in the wrong order, and you have to use the hideous forwardRef (which I don't consider acceptable at all) to work around that. If someone can find a better way to do this, that would be great. The problem might go away on its own if we end up getting an ORIGIN_URL from a third-party package (e.g., Mark's aspnetcore-engine).

*Originally created by @SteveSandersonMS on 5/11/2017* As per [this comment](https://github.com/aspnet/JavaScriptServices/issues/800#issuecomment-300823558), this is a first step towards updating to Angular 4. It's an attempt at the minimal changes needed to get Angular 4 working correctly on both client and server. I've pushed a prerelease version of `generator-aspnetcore-spa` to NPM so that people can try this out (details below). I'd like to get a pretty substantial level of feedback that this works properly in all the existing scenarios before we merge this into `dev` and ship it as the released template package. ### How to try it Install the prerelease version of the Yeoman generator: ``` npm install -g generator-aspnetcore-spa@next ``` (having already installed Yeoman using `npm install -g yo` if you don't already have it) ... and then create a new project: ``` yo aspnetcore-spa ``` Please tell us how you get on with it. **Notes** There are a couple of implementation details I'm not yet totally happy with: * In `boot-server.ts`, the error handling is messy. Because Angular fires `onStable` before it fires `onError`, I've had to use a nasty `setImmediate` hack to wait for possible errors before rendering the page. This doesn't feel like it should be the right solution. However, I've looked for examples of people using `platformDynamicServer` across the web, and it seems like virtually nobody is using it yet, there are no official samples, and the few examples I can find don't even make any attempt at error handling at all. So, @MarkPieszak, is the event ordering a bug in Angular, or is there some other way we're meant to catch errors? * The `ORIGIN_URL` token is just a string right now. It would be better if we had an actual class like `RequestContext` so you could have component constructor parameters like `context: RequestContext` without having to use the `@Inject` decorator at all. But when I tried to do that, it didn't work because the code evaluates in the wrong order, and you have to use the hideous [`forwardRef`](https://blog.thoughtram.io/angular/2015/09/03/forward-references-in-angular-2.html) (which I don't consider acceptable at all) to work around that. If someone can find a better way to do this, that would be great. The problem might go away on its own if we end up getting an `ORIGIN_URL` from a third-party package (e.g., Mark's `aspnetcore-engine`).

fergalmoran closed this issue

2025-08-09 17:17:36 +00:00

fergalmoran referenced this issue

2025-08-09 17:18:12 +00:00

Added docker support to sample projects #925

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github/JavaScriptServices#768