有没有更好的方法在Angular Js

时间:2017-09-22 11:53:08

标签: javascript angularjs

我已使用PUTPOST请求来修改和创建数据。但事情是POST请求无法正常工作。当我单击add()按钮时,自动POST请求在填充文本字段中的信息之前在json数据中生成id。

此外,当我点击save()按钮时,应该更新数据。下面我粘贴了我的代码,如果我犯了任何错误,请告诉我,我感谢每一位提供任何信息的人。

HTMl:

<button class="btn btn-info" ng-click="addmode()"> Add </button> 
<button class="btn btn-success" ng-show="editMode" ng-click="saveinfo()"> Save </button>

Angular JS:

$scope.addmode = function(information) {
    var postinfo = information;
    $http({
        url:'http://localhost:3000/contacts' , 
        method : 'POST',
        data : postinfo
    })
    .then(
        function successCallback(response) {
            $scope.selectedcontact = '';
            console.log(response.data)
        },
        function errorCallback(response) {
            console.log("Error : " + response.data);
        });    
    };

1 个答案:

答案 0 :(得分:0)

首先创建服务/ api.js

angular.module('app')
    .factory('api', function ($rootScope,ApiEndpoint, $http, $q,$timeout,$cookies) {


        var get = function (url) {
            var config = {url: url, method: ApiEndpoint.Methods.GET};
            return this.call(config);
        };

        var del = function (url) {
            var config = {url: url, method: ApiEndpoint.Methods.DELETE};
            return this.call(config);
        };

        var post = function (url, data) {
            var config = {url: url, method: ApiEndpoint.Methods.POST, data: data};
            return this.call(config);
        };

        var put = function (url, data) {
            var config = {url: url, method: ApiEndpoint.Methods.PUT, data: data};
            return this.call(config);
        };

        return {call: call, get: get, post: post, del: del, put: put};
    });

创建服务/ apiendpoint.js后

angular.module('app')
    .constant('ApiEndpoint', {
        ServerUrl:  'http://localhost/',
        BaseUrl: 'http://localhost/',
        Methods: {GET: 'GET', POST: 'POST', PUT: 'PUT', DELETE: 'DELETE'},
        Models: {
            test:"fe_api/test",


},
        URLS: {
            QUERY: 'app/'
        },
        getUrl: function (url) {

            var host=window.location.host;
            var protocol=window.location.protocol ;
            return protocol+"//"+host+"/"+url;

        }
    });

**创建模型处理程序**

angular.module('app')
    .factory('ApiService', function (api, ApiEndpoint) {

        var getModel = function (url_part)
        {
            var url = ApiEndpoint.getUrl(ApiEndpoint.URLS.QUERY) + url_part;
            return api.get(url);
        };

         var getModelViaPost = function (url_part, data)
        {
            var url = ApiEndpoint.getUrl(ApiEndpoint.URLS.QUERY) + url_part;
            return api.post(url, data);
        };

        var postModel = function(model_name, data) {
            var url = ApiEndpoint.getUrl(ApiEndpoint.URLS.QUERY) + model_name;
            return api.post(url, data);
        };

        var putModel = function(model_name, data) {
            var url = ApiEndpoint.getUrl(ApiEndpoint.URLS.QUERY) + model_name;
            return api.put(url, data);
        };

        var deleteModel = function(model_name, id) {
            var url = ApiEndpoint.getUrl(ApiEndpoint.URLS.QUERY) + model_name + '/' + id;
            return api.delete(url);
        };



        return {
            getModel: getModel,
            postModel : postModel,
            putModel : putModel,
            deleteModel : deleteModel,
            getModelViaPost : getModelViaPost
        };

    });

在控制器中编写API调用

var data = {
            wut_token: $cookies.data,
        };
        ApiService.postModel(ApiEndpoint.Models.test, data).then(function (response) {
            if (response.SUCCESS == "FALSE") {

            } else {


            }
        })