Angular 4.x integration

[MarkPieszak]

Some notes:

Approximate boot-server API will be:

platform
  .bootstrapModuleFactory(MyAppModuleFactory)
  .then((ref: ApplicationRef) => ref.isStable.filter(v => v).toPromise())
  .then(() => {
     return { 
       html: platform.injector.get(PlatformState).renderToString()),
       meta: platform.injector.get(MetaServce)
     };
  } 
  .then(result => /* do magic */ )
  .then(() => platform.destroy());

Then we'll integrate it with .NET to render the Title & Meta tags in the MVC view template.

This is also connected to #10

[kukjevov]

Any news here? Are you planning to update this for beta.8 or will you wait for rc.0 ng4 ?

Thank you for great job here :-)

[MarkPieszak]

I'll be updating very shortly currently testing it out to make sure and give feedback to the team, I'll make a PR to the repo in the next day or two!

When it gets in let me know if any issues pop up for you! @kukjevov

[kukjevov]

Hello :).

I can see that you are already working on it, it is just great :). I want to ask you are there any changes required from https://github.com/aspnet/JavaScriptServices project to make angular4 working? Are you planning to update also their template for Angular2Spa, or you are going in different direction as they are going ?

Thank you :)

[MarkPieszak]

So far everything is going well! I'm currently creating a wrapper for the .NET integration so it will automatically try to pass down Title/Meta & Styles tags separately (for you to parse yourself on the .NET side).

Yes I was going to send a PR to the JavaScriptServices repo as well! Some main differences will be that we'll no longer use the TagHelper, and that the code will either be triggered in the Controller Action, and passed down via ViewData, or in the .cshtml file itself.

I'll message you as soon as I get a more polished PR to get in here so you can test it out and give me any feedback! Sorry for the delay, I'm making sure to give any feedback back to the team quickly so everything works flawlessly for .NET as well.

Cheers

[hheexx]

Hi Mark!

I know you are redoing angular-asp integration now so I wanted to ask if we can make a way that if angular router can't find a route that it send's that info to asp so it can set http status code to 404.

Important for SEO.

[MarkPieszak]

Hey @hheexx
So I'm going to be gone this next week so I can't imagine I'll be able to put anything up just yet (I'd rather make sure everything is ironed out and totally production ready!) It shouldn't be an issue to have both AoT and ng 4.x though no worries :)

As for the 404, if you refresh the page here: It actually already does Render the 404 on the server through the Angular app: http://aspnetcore-angular2-universal.azurewebsites.net/not-found

You want .NET to handle that instead?

[AbrarJahin]

I think that is not possible to handle 404 page by the server because angular works after server HTTP done and it works on the pages what is not existing on the server.

So, 404 page should be handled by angular as far as I know.

if you @hheexx need to use a server rendered 404 page then you should use that inside angular 404 page with a service, as far as I know.

Isn't it right @MarkPieszak ?

[hheexx]

Mark, you can see in developer tools.
404 page you shared is still served with http status code 200.
https://i.gyazo.com/ce381a772a4ca7b47e1f1dc0c760dc7f.png
That is not good for SEO. Google does not understand it's 404 page.

It is ok that 404s are served from angular but we just need a way for a angular to pass right status code to asp with rendered string so asp can set correct status code.

[hheexx]

How it's going @MarkPieszak ?

Just to remind you, it's really burning under my feet xD

[dguisinger]

Hey @MarkPieszak any comments on where this is at? I saw you commented in your last ng4 branch checkin that you were shelving changes for now.

Any timeline for when things will be ready? ng4 release should be almost any day now.

Also, I hate to be that person, but any chance you can write a walkthrough on how to convert a project that was built from the version included in JavascriptServices back in November. I've slowly been working through all of the changes, but things are vastly different and not really a drop-in replacement if you already built a project off of the old code.

[MarkPieszak]

Glad you asked I'm actually working on it now :)

Using the latest RC5 that was released a second ago today 👍 screenshot below

---

I'm actually trying to mirror more closely to Steve's JavaScriptServices to make life easier for people, there have been some recent big changes to the App structure but they seem to be causing more problems than helping, so I'm going back to a more simpler structure :)

I'll do the best I can do document an upgrade strategy as well! @dguisinger @hheexx @kukjevov

Expect something in here by the latest Sunday.
4.0 official release is next week 💯

[dguisinger]

Great, looking forward to it.

Any idea how to solve this? I had your code up and running, and I can't figure out what I changed but now I'm getting:
NodeInvocationException: The Node invocation timed out after 60000ms.
You can change the timeout duration by setting the InvocationTimeoutMilliseconds property on NodeServicesOptions.

I kept increasing the timeout, but it seems to top out at 60 seconds even if I put 120 seconds as the setting. If I turn off server side rendering things work just fine. The lack of visibility into what is going on here is quite frustrating, I've been stuck on this all day.