模板視圖和AngularJS之間衝突的解決方案_AngularJS

本文執行個體講述了模板視圖和AngularJS之間衝突的解決方案。分享給大家供大家參考，具體如下：

問題：

在php的mvc視圖中，我們需要在載入的過程中

傳遞一些資料給模板：

如：

這裡是某個 controller

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

這裡是對應的視圖

<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>

那麼現在問題來了 如何處理 1 和 2 之間的矛盾？

第一種解決方案：

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

我們將 php傳過來的資料存放區在變數裡，然後再通過
$scope對其進行賦值，ok

第二種解決方案(推薦)：

我們使用ng-if屬性解決我們的問題，對於users未定義時調用php資料
ajax傳遞完成後使用我們的資料並定義 $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>

demo示範地址：https://jsfiddle.net/mser49aq/1/

希望本文所述對大家AngularJS程式設計有所協助。