发表新帖
发表新帖

Improving AngularJS Simple Factory - wrapper around PhoneGap Storage API

后端 未结
关注
2 481
面向向阳花
面向向阳花 2021-01-15 03:24

i am trying to do something \"nice\" in AngularJS with my so-so JS skills and i would like to hear how would you feel or improve/refactor following:

angular.
相关标签:
2条回答
  • 北荒
    2021-01-15 03:58

    http://rburns.paiges.net/about/ anwers following:

    function getCategories(){
  return promisedQuery('SELECT * FROM CATEGORIES', defaultResultHandler, defaultErrorHandler);
}

function getDishes(){
  return promisedQuery('SELECT * FROM DISHES', defaultResultHandler, defaultErrorHandler);
}

function defaultResultHandler(deferred) {
  return function(tx, results) {
    var len = results.rows.length;
    var output_results = [];

    for (var i=0; i<len; i++){
      output_results.push(results.rows.item(i));
    }

    deferred.resolve(output_results);  
  }  
}

function defaultErrorHandler(err) {
  alert("Error processing SQL: " + err.code);
}

function promisedQuery(query, successCB, errorCB) {
  var deferred = $q.defer();
  db.transaction(function(tx){
    tx.executeSql(query, [], successCB(deferred), errorCB);      
  }, errorCB);
  return deferred.promise;  
}
    0 讨论(0)
  • 南旧
    2021-01-15 04:05

    perhaps i am wrong but from my 1st exp with angular i think there is something u missed as i missed it

    if you connect the view(UI) strait to the service/factory then you dont need deffered and all kinda updates but it updates itsef automatically, and its done like this

    <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <style>
        .main { width: 400px; }
        .singleItem { width: 25%; display:inline-block; border: 2px dashed green; }
        .textContainer { text-align: center; }
    </style>
    <script src="angular.js"></script>
    <script >
        var myStudyModule = angular.module('myStudyModule', []);

        myStudyModule.service('myService', function ($http) {
            console.log("myService");
            var self = this;
            self.catalog = [];

            self.getData = function (parentKey, level) {
                console.log("myService.getMyData");
                var url = 'Handler1.ashx';
                if (parentKey && level)
                    url += '?parentKey=' + parentKey + '&level=' + level;
                $http.get(url).success(function (data) {
                    console.log("$http.get.success");
                    self.catalog = data;
                });
            };

            self.getData();
        });

        var myController = function ($scope, myService) {
            console.log("myController");
            $scope.myService = myService;

            $scope.MainItemClick = function (catalogItem) {
                console.log("$scope.MainItemClick");
                myService.getData(catalogItem.key, catalogItem.level + 1);
            };
        };

        myStudyModule.controller(myController);
    </script>
</head>
<body>
    <div class="main" ng-app="myStudyModule" ng-controller="myController"> 
        <div class="singleItem" ng-repeat="catalogItem in myService.catalog" ng-click="MainItemClick(catalogItem)" >
            <a class="box" href="#" >
                <img ng-src="{{ catalogItem.image }}" width="100">
                <div class="textContainer" >
                    <h4>{{ catalogItem.level }} - {{ catalogItem.name }}</h4>
                </div>
            </a>
        </div>
    </div>
</body>
</html>

    btw i have many more self study examples here https://skydrive.live.com/redir?resid=949DC4EDBFFD4738!227&authkey=!AO_dsCMOFqndeLU

    0 讨论(0)
 看不清?
提交回复
热议问题