如何重构前端JS到Angular 2与PHP MVC后端很好地配合？ [关闭]

Question

I have a huge PHP MVC web application, which now uses for some click events and modal dialog rendering jQuery. To stay confident with modern frontend technologies, I would like to refactor the JavaScript code to run under Angular 2. But my main question is: How can I do this? Angular 2 doesn't have controllers anymore, which really complicate things in my use case. I mainly just need some click event subscribing and modal dialog handling on the JavaScript side. The most part of the HTML is rendered in the PHP backend.

For example, let's say we have a news site (route: index/news) with many news entries. Actually, this is completely done in the backend by fetching data from the database, load a helper for each news entry and output it in the view. If I would refactor this to a component, then I would have massively ajax requests for each news entry. I believe this is not the preferred way of using Angular 2. Also, what I really need is some interaction on buttons etc.. I think it is also not the meaning of Angular 2 to create a small template string with the buttons and an ngClick inside of that, just for having an ngClick on my button.

So, please tell me how I can integrate Angular 2 in a nice way, so that these two technologies play well with each other.

Answer 1

Even tho you're getting downvotes, let me help you to start a BIG journey if you're willing to really do that.

---

First, if your views are generated on the backend :

"The most part of the HTML is rendered in the PHP backend."

According to that sentence, I imagine that you don't have a REST API. Single Page Application are meant to live in the browser without reloading the whole page. This is going to be a problem with your current stack. (otherwise, there's no point doing SPA).

So I'd propose you to stop generating views from your backend and return raw data (json objects). To do that, read some articles about REST APIs.

---

Then, you'll need to start learning Angular2 and understand SPA logic. I'd recommend you to take a look to the official website : http://angular.io

---

Honnestly, this is a very big step forward and I'm not sure you'll be able to do that with en existing app. BUT, it's very interesting for sure and you might want to learn more about all that before your make/participate to an other project.

Good luck