0

そのサービスが与えられた場合(サーバー上でjsonをフェッチするだけ)

SushiServices = angular.module("SushiServices",[])

SushiServices.factory("DataTypeService",["$http",($http)->
    self = {}
    self._data = []
    self._inilialized = false
    return ->
        if  self._inilialized ==false
            $http.get("data/types.json").success (data)->
                self._data = data;
                self._inilialized = true

        return self._data
])

コントローラでそのサービスを使用するとします:

ProductListController = ($scope,$rootScope,$http,$filter,DataTypeService)->
    ### 
        EN : manage product list display 
        FR : gère l'affichage de la liste de produits 
    ###
    $rootScope.types = DataTypeService()

$ rootScope.typesは繰り返し使用されますが、問題は明らかです:-ページをレンダリングすると、jsonがまだ正常にフェッチされていないため、リピーターに何も表示されません。

どうすればアプリを設計できますか?サーバーから何かが戻ってきたときにテンプレートが自動的に更新されますか?ありがとう

テンプレート:

 <span ng-repeat='type in types'>
        <a href='javascript:void 0;' ng-click="addToSelectedTypes(type.id)" class='label trans' style="font-size: 15px" ng-class="getSelectedClass(type.selected)" >{{type.name | capitalize }}</a>
      </span>
4

1 に答える 1

1

問題はself._data、サービスから返された関数から戻ることです。selfオブジェクト全体を(DataTypeServiceファクトリから戻る関数から)返し、ビューを調整してを使用しtypes._dataます。その後、マークアップは自動的に更新されます。

または、データがまだ利用できないときに表示されるプリローダーを作成することもできます。

<div class="preloader" ng-show="!types._initialized"></div>

そして、リピーターはしばらくの間非表示になります(そしてデータが正しくロードされたときに表示されます):

<div ng-show="types._initialized">
    <span ng-repeat="type in types._data">
        <a href="javascript:void 0;">{{type.name | capitalize }}</a>
    </span>
</div>
于 2012-12-13T12:38:16.210 に答える