伍重複不更新，直到刷新頁面

給什麼我工作的一個簡短的概要：伍重複不更新，直到刷新頁面

這個程序是一個電話簿，使得調用我們的後端系統，並返回一個JSON有效載荷，然後將其解析並存儲到本地存儲以便離線訪問，然後數據以簡單的主屏幕格式顯示。

舉個簡單的工作流程：

用戶登錄
呼叫通過Ajax請求到後端的用戶的帳戶下由
數據存儲到本地存儲
數據是添加到$ rootScope.allEmployeeInformation變量
Ion-List反映存儲在主屏幕上的$ rootScope.allEmployeeInformation變量中的數據。

我的問題就出在這裏：

在數據記錄之後被拉動並妥善保存，但直到刷新頁面或者通過拉刷新功能我已經實現了離子列表不顯示數據，重新同步按鈕或重新啓動應用程序。

有沒有什麼方法可以確保這些數據片段在用戶不需要刷新頁面的情況下顯示？

將很樂意提供所需的任何信息。謝謝你們的幫助！

編輯，有一些代碼更新的要求：

Code which performs the ajax request

HTML中顯示的信息：

<ion-view> 
<ion-content class="scroll-content has-header animated fadeIn" ng-controller="HomeScreenController" padding="true"> 
<ion-refresher 
pulling-text="Pull to resync...." 
on-refresh="resyncEmployees(true)"> 
</ion-refresher> 
<ion-list> 
<ion-item 
class="ion-item-content" 
ng-repeat="employee in allEmployeeInformation | orderBy:'lastName'" 
ng-controller="AccountCtrl" 
ng-click="changeTabb(1, {{employee.identifier}})"> 

<div class="item-icon-left"> 
<i class="icon ion-person"></i> 
<h3>{{employee.userCN}}</h3> 
<h5>{{employee.title}}</h5> 
<h6>{{employee.town}}</h6> 
</div> 

<div class="item-icon-right"> 
<i class="icon ion-chevron-right icon-accessory"></i> 
</div> 

</ion-item> 
</ion-list> 
</ion-content> 
</ion-view>

編輯＃2：我相信我已經收窄至下降到事實上這是一個ng-repeat的問題，而不是我第一眼看到的Ion-List。更新參考標籤。

乾杯！邁克

來源

2016-09-07 Michael Amato

您的ajax請求正在將數據轉儲到rootScope中，但從未更新ng-repeat正在使用的allEmployeeInformation變量。根本沒有理由涉及根域。 –

很簡單 - 你正在使用jQuery的$.ajax，並且不會觸發摘要循環。摘要循環是告訴Angular更新和2路綁定本質上（愚蠢）。使用提供的Angular $http模塊。這將擺脫任何客戶端的改變，到目前爲止您所做 -

$http.get(agent).then(function(response) { 

});

而且，你在你的代碼的調用結束location.reload()。你可能不需要那個。

來源

2016-09-08 14:17:56 tymeJV

感謝@tymeJV的迴應 - 看看這是否解決了我的問題，並報告給其他人將來也會遇到同樣的問題。意外地忘記刪除paste.in上的location.reload（）...很好！謝謝！ –

@MichaelAmato - 沒問題 - 同樣，未來的提示 - 在這裏發佈你的代碼，而不是在一個pastebin - 它會得到更多的觀衆，並遵循發佈規則：D – tymeJV

Thanks @tymeJV！將爲未來做...業餘的錯誤，對不起！只是更新了代碼以使用$ http.get而不是Ajax，現在看起來安全包裝比我的團隊用來訪問我們的後端代理造成了問題。我們對用戶進行身份驗證，然後包裝器會自動將任何所需的cookie附加到ajax請求以訪問所需的後端代理。將繼續調查。 –

沒有看到任何代碼，你也可以嘗試在路由配置設置cache: false。看到下面的例子：

.state('dashboard', { 
    cache: false, 
    url: '/dashboard', 
    views: { 
    'menuContent' : { 
     templateUrl: 'templates/dashboard.html', 
     controller: 'DashboardController', 
    } 
    } 
})

如果您有任何可供發佈的代碼，我可以幫助更多。

編輯爲什麼你需要使用$rootscope？您還應該嘗試使用$scope，因爲如果您想在另一個視圖或控制器中使用它，您將始終訪問localStorage中的員工信息。

來源

2016-09-07 19:46:35 dmonaldo

感謝您的回覆@ user1237122！我剛剛使用一些代碼更新了我的文章，以瞭解您是否可以提供更多見解。在ajax請求完成將代碼放入無限循環的刷新之後，似乎會強制刷新，因爲每次刷新應用程序時都需要執行ajax請求，以確保獲得最新的員工信息。再次感謝！ –

剛剛意識到，我忘了在狀態結果中將設置緩存添加到false，即使在允許先前顯示信息的刷新之後也沒有顯示任何數據。 –

「強制重新加載頁面」對於Angular應用程序來說是一個糟糕的策略 - SPA的重點在於當數據更新時不需要重新加載頁面。 –

伍重複不更新，直到刷新頁面

回答

相關問題