AngularJS:表编辑数据+更新服务器

时间:2015-05-11 11:42:21

标签: javascript angularjs

我已经设法使用AngularJS创建了一个表。在此表中,我显示了来自我的数据库的产品,可以对类别或其他关键字进行过滤。现在,用户应该能够在此表中更改此数据以更新数据库中的数据。

AngularJS

class YourViewController {
    var locManager: CLLocationManager!

    override func viewDidLoad() {

        locManager = CLLocationManager()
        locManager.requestWhenInUseAuthorization()
        locManager.startUpdatingLocation()
        ...
    }
}

HTML表格

categorieFilter = angular.module("categorieFilter", [])
categorieFilter.controller("catFilter", ["$scope", "store", function($scope, store){
    $scope.search = "";
    $scope.products = [];
    $scope.categories = [];

    store.getCategories().then(function(data){
        $scope.categories = data;
    })
    store.getProducts().then(function(data){
        $scope.products = data;
    })    

    $scope.filterProductsByCats = function(category){
    $scope.search = category;
    };
}])

categorieFilter.factory('store', function($http, $q){
    function _getCategory (){
        var deferred = $q.defer();
        $http.get('api/categories').success(function (data) {
                deferred.resolve(data);
            })
        return deferred.promise;
    }

    function _getProducts (){
        var deferred = $q.defer();
        var prods = [];
        $http.get('api/products').success(function (data) {
            for(var i = 0;i<data.length;i++)
            {
                prods[i] = {name: data[i][0], category: data[i][2], price: data[i][1]};
            }
            deferred.resolve(prods);
        })
        return deferred.promise;
    }
        return {
         getCategories: _getCategory,
         getProducts : _getProducts
        };
});

要完成这项任务的任何想法或建议吗?

1 个答案:

答案 0 :(得分:0)

我喜欢用来实现数据编辑的库是有角度的xeditable。 http://vitalets.github.io/angular-xeditable/

然后将其发布回webapi

进行保存