0

は、私が働いているかの簡単な要約を与えるために更新されますオフラインアクセスのためにローカルストレージに保存され、データは簡単なホーム画面形式で反映されます。NG-繰り返して

  1. バックエンドをする
  2. コールAjaxリクエストが
  3. ユーザーのアカウントの下で行われている経由でデータを
  4. ローカルストレージに格納されたデータは、ユーザーがログイン:シンプルなワークフローを与えること

    $ rootScope.allEmployeeInformation変数に追加

  5. 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の問題であり、一見すると期待したイオンリストではありません。参照タグの更新。

乾杯! Mike

+0

あなたのajaxリクエストは、rootScopeにデータをダンプしていますが、 'ng-repeat'が使用している' allEmployeeInformation'変数を更新しません。ここにルートスコープを含める理由はありません。 –

答えて

4

かなり簡単です - あなたはjQueryの$.ajaxを使用しており、ダイジェストサイクルをトリガーしません。ダイジェストサイクルは、Angularが更新する方法と、2ウェイバインドを本質的に行う(ダンブルダウンする)方法です。付属の角度$httpモジュールを使用してください。

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

}); 

また、あなたのコードの末尾にlocation.reload()を呼んでいる - 任意のクライアントを取り除くであろうが、あなたがこれまでに行った変更します。あなたはおそらくそれを必要としません。

+0

応答@ tymeJVありがとう - これは私の問題を修正し、将来的に同じことが発生している他の人のために報告するかどうかを確認するつもりです。誤ってその場所を削除するのを忘れてしまった。pasteBinでlocation.reload()を...良いキャッチ!ありがとう! –

+0

@MichaelAmato - 問題はありません - また、将来のヒント - ここにあなたのコードを貼り付けてください - それはより大きい聴衆を取得し、掲載ルールに従います:D – tymeJV

+0

ありがとう@tymeJV!未来のためにやる...素人間違い、申し訳ありません!ちょうどAjaxではなく$ http.getを使うようにコードを更新しました。私たちのバックエンドエージェントにアクセスするために私のチームよりもセキュリティラッパーが問題を引き起こしているようです。私たちはユーザーを認証し、ラッパーはajaxリクエストに必要なクッキーを自動的に添付して、必要なバックエンドエージェントにアクセスします。調査を続けます。 –

0

コードが表示されていない場合は、ルート設定でcache: falseを設定することもできます。下記の例を参照してください。

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

投稿可能なコードがあれば、私はもっと手伝うことができます。

編集 なぜ$rootscopeを使用する必要がありますか?別のビューまたはコントローラで使用する場合は、localStorageの従業員情報に常にアクセスできるため、$scopeを代わりに使用するようにしてください。

+0

返信ありがとう@ user1237122! もう少し洞察力を提供できるかどうかを確認するために、コードの一部で私の投稿を更新しました。これは、最新の従業員情報を確実にするためにアプリがリフレッシュされるたびにajaxリクエストが実行される必要があるため、ajaxリクエストの完了後にコードを無限ループのリフレッシュに置き換えた後に更新を強制しているようです。再度、感謝します! –

+0

ちょっと気付いたのは、その設定キャッシュを状態にfalseに追加するのを忘れてしまったため、以前に情報を表示できるようにしていたリフレッシュ後でもデータが表示されませんでした。 –

+0

「ページリロードを強制する」は、Angularアプリケーションにとってはひどい戦略です.SPAの重要なポイントは、データが更新されたときにページをリロードする必要がないことです。 –

関連する問題