如何将控制器与服务同步

时间:2016-08-28 01:21:38

标签: angularjs sqlite ionic-framework android-sqlite

我正在测试angular和SQLite的通信。当用户访问页面时,我需要从数据库中获取所选公司的ID和NAME。我使用ion-autcomplete在CRUD页面中选择公司。

服务: sqlite.js

(function () {


'use strict';

  angular
    .module('Test')
    .service('$sqliteService', $sqliteService);

  $sqliteService.$inject = ['$q', '$cordovaSQLite'];
  function $sqliteService($q, $cordovaSQLite) {

    var self = this;
    var _db;

    self.db = function () {
      if (!_db) {
        if (window.sqlitePlugin !== undefined) {
          _db = window.sqlitePlugin.openDatabase({ name: "my.db", location: 2, createFromLocation: 1 });
        } else {
          // For debugging in the browser
          _db = window.openDatabase("my.db", "1", "Database", 200000);
        }
      }
      return _db;
    };

    self.getFirstItem = function (query, parameters) {
      var deferred = $q.defer();
      self.executeSql(query, parameters).then(function (res) {

        if (res.rows.length > 0)
          return deferred.resolve(res.rows.item(0));
        else
          return deferred.reject("There aren't items matching");
      }, function (err) {
        return deferred.reject(err);
      });

      return deferred.promise;
    };
  }
})();

工厂: CompanyService.js

(function () {


'use strict';

  angular
    .module('Test')
    .factory('CompanyService', CompanyService);

  CompanyService.$inject = ['$q', '$sqliteService'];
  function CompanyService($q, $sqliteService) {

    return {      
      getId: function (Id) {

        var query = "Select * FROM Company WHERE ID = ?";
        var values = [Id];

        return $q.when($sqliteService.getFirstItem(query, values));
      }
    };
  }
})();

控制器: CompanyController.js

(function() {
  'use strict';

  angular
    .module('Test')
    .controller('CompanyEditController', CompanyEditController);

  CompanyEditController.$inject = ['$scope', '$q', '$stateParams', '$state', '$cordovaCamera', '$cordovaImagePicker', '$ionicPopup', 'CompanyService'];
  function OcorrenciaEditController($scope, $q, $stateParams , $state, $cordovaCamera, $cordovaImagePicker, $ionicPopup, CompanyService) {

    var vm = $scope;

    vm.modelToItemMethod = function (modelValue) {
      var d = $q.defer();
      CompanyService.getId(modelValue)
        .then(function(data) {
          console.log('My first promise succeeded', JSON.stringify(data));
          $q.resolve(data);
        }, function(error) {
          console.log('My first promise failed', error.message);
        });
      return d.promise;
    };
})();

Company.html

<input ion-autocomplete ng-model="company.IdCompany" type="text" name="fieldEmpresa" placeholder="Empresa" readonly="readonly" class="ion-autocomplete" autocomplete="off" max-selected-items="1" required
                 item-value-key="Id"
                 item-view-value-key="CompanyName"
                 items-method="getTestItems(query)"
                 cancel-label="Cancel"
                 items-removed-method="itemsRemoved()"
                 loader-icon="spinner"
                 external-model="company"
                 model-to-item-method="modelToItemMethod(modelValue)"/>

我不明白为什么我需要使用de&#34; $ q.defer&#34;在控制器内如果我在工厂和服务中使用。如果我不使用,控制器无法将值返回到ion-aucomplete。我错过了什么吗?或者代码是对的?

1 个答案:

答案 0 :(得分:2)

您正在将此方法绑定为自动完成;由于ajax调用是异步的,你必须返回一个原始的。这就是为什么你最终使用$ q.defer。

如果您不想使用$ q,那么您可以在VM.modelToItemMethod中执行return CompanyService.getId(modalValue);,而不是使用$ q.defer,它会返回一个延迟对象。