angularjs http post 405 error

Problem

angular http로 data를 담아 post를 날렸다. 헤더엔 넣은 데이터의 json key value값이 잘 들어가있는데(사실 그런것처럼 보이는 것이다) 데이터가 오지 않았다는 에러가 난다.

$http.defaults.xsrfCookieName = 'csrftoken';
        $http.defaults.xsrfHeaderName = 'X-CSRFToken';

        $http.post('/api/stock/'+$('.stock-select').val()+'/'+operationName+'/', {
            inventory: $('.inventory-select').val(),
            quantity: $('.number-select').val()
        }, {
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
            }
        }).then(function(res){
            console.log("success", res);
        }, function() {
            alert("error");
        });

Solution

key value가 아닌, json을 통으로 인식해서 생기는 문제이므로, 데이터를 $.param으로 감싸서 보내준다. 앵귤러 웨저러는고야~~

$http.defaults.xsrfCookieName = 'csrftoken';
        $http.defaults.xsrfHeaderName = 'X-CSRFToken';

        $http.post('/api/stock/'+$('.stock-select').val()+'/'+operationName+'/', $.param({
            inventory: $('.inventory-select').val(),
            quantity: $('.number-select').val()
        }), {
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
            }
        }).then(function(res){
            console.log("success", res);
        }, function() {
            alert("error");
        });

참고

ajax로 보내기

function getCookie(name) {
            var cookieValue = null;
            if (document.cookie && document.cookie != '') {
                var cookies = document.cookie.split(';');
                for (var i = 0; i < cookies.length; i++) {
                    var cookie = jQuery.trim(cookies[i]);
                    // Does this cookie string begin with the name we want?
                    if (cookie.substring(0, name.length + 1) == (name + '=')) {
                        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                        break;
                    }
                }
            }
            return cookieValue;
        }
        var csrftoken = getCookie('csrftoken');

        $.ajax({
            type: 'POST',
            url: '/api/stock/'+$('.stock-select').val()+'/'+operationName+'/',
            data: {
                inventory: $('.inventory-select').val(),
                quantity: $('.number-select').val()
            },
            headers: {
                "X-CSRFToken": csrftoken
            },
            success: function() {
                console.log("success")
            }
        });

Refer

http://stackoverflow.com/questions/27387467/angularjs-http-post-method-405-error

Advertisements

momentJS를 angularJS 필터에서 사용하기

Problem

스크린샷 2016-01-25 오후 6.55.20

angularJS로 ERP를 만드는 중이다.
ng-repeat로 반복되는 칼럼에 타임스탬프가 안 예쁘게 찍혀서 moment.js로 가독성을 높이려 한다.

javascript에서 가로채서 솰라솰라 하는거 말고 angular로 예쁘게 하는 방법은 없을까?

 

Solution

angularjs filter를 사용한다.

sandiApp.filter('moment', function() {
    return function(dateString, format) {
        return dateString? moment(dateString).format(format): null;
    };
});

이 jsfiddle을 참고하고, 값을 입력 안하면 null이 반환되게 살짝 추가해두었다.

<td>{{ invoice.ordered_time | moment:'YYYY년 MMMM Do dddd a h:mm' }}</td>

원하는 출력 형태를 써주면 filter에서 moment(원래적히던값).format(적어준포맷)으로 모멘트를 통과해서 뿌려준다.

Outcome

스크린샷 2016-01-25 오후 7.03.20

예뻐짐.