我应该将AngularJS与PHP框架混合使用吗？ [关闭]

Question

AngularJS is very powerful when it comes to interactive HTML5 and model binding. On the other hand, PHP frameworks like Yii enable quick, well-structured, safe and powerful web application development. Both technologies provide sophisticated means for data access, iteration and page layouting.

Is it good or bad practice to mix those two approaches (client-side and server-side "page setup") or is this rather against the meaning of interactive, seamless HTML5 AJAX web applications?

I am not talking about generating JS using PHP (See this question) - I'm talking about generating a view that will make use of AngularJS.

I also know that an AngularJS page should (or can) communicate with the server via REST services to get data (See this question) instead of retrieving it from for example PHP variables directly. But to me it seems more convenient to design the "frame" for the entire web application separately in PHP (e.g. build the main menu or handle authorization/ sessions etc.)

Answer 1

It seems you may be more comfortable with developing in PHP you let this hold you back from utilizing the full potential with web applications.

It is indeed possible to have PHP render partials and whole views, but I would not recommend it.

To fully utilize the possibilities of HTML and javascript to make a web application, that is, a web page that acts more like an application and relies heavily on client side rendering, you should consider letting the client maintain all responsibility of managing state and presentation. This will be easier to maintain, and will be more user friendly.

I would recommend you to get more comfortable thinking in a more API centric approach. Rather than having PHP output a pre-rendered view, and use angular for mere DOM manipulation, you should consider having the PHP backend output the data that should be acted upon RESTFully, and have Angular present it.

Using PHP to render the view:

/user/account

if($loggedIn)
{
    echo "<p>Logged in as ".$user."</p>";
}
else
{
    echo "Please log in.";
}

How the same problem can be solved with an API centric approach by outputting JSON like this:

api/auth/

{
  authorized:true,
  user: {
      username: 'Joe', 
      securityToken: 'secret'
  }
}

and in Angular you could do a get, and handle the response client side.

$http.post("http://example.com/api/auth", {})
.success(function(data) {
    $scope.isLoggedIn = data.authorized;
});

To blend both client side and server side the way you proposed may be fit for smaller projects where maintainance is not important and you are the single author, but I lean more towards the API centric way as this will be more correct separation of conserns and will be easier to maintain.