Solution to conflict between template views and AngularJS

The examples in this article describe how to resolve conflicts between template views and AngularJS. Share it with everyone for your reference, the details are as follows:

Problem:

In the mvc view of php, we need to

pass some data to the template during the loading process:

For example:

Here is a controller

$data['users'] = {something from databases};
$this->load->view('home/index',$data);

Here is the corresponding view

<div ng-controller="loadData">
   <ul>
    <!--1. 初始化的时候我们需要使用下面这句-->
    <?php foreach(users as user):?>
    <li><?=$user->name?>:<?=$user->email?><li>
    <?php endforeach?>
    <!--2. 但是结束后 我们需要使用这句 通过ajax 更新 -->
    <li ng-repeat="user in users">{{user.name}}:{{user.email}}</li>
  </ul>
</div>

So now the question is how to deal with the contradiction between 1 and 2?

The first solution:

<script>
 var usersPrefetch = [
  <?php foreach(users as user):?>
  {"name": "<?=$user->name?>", "email": "<?=$user->email?>"},
  <?php endforeach?>
 ];
</script>

We store the data passed by php in variables, and then assign it through
$scope, ok

The second solution (recommended):

We use the ng-if attribute to solve our problem, calling php data when users is undefined
After the ajax transfer is completed, use our data and define $scope.users

<ul ng-if="!users">
 <?php foreach(users as user):?>
 <li><?=$user->name?>:<?=$user->email?><li>
 <?php endforeach?>
</ul>
<ul ng-if="users">
 <li ng-repeat="user in users">{{user.name}}:{{user.email}}</li>
</ul>