2017-10-02 4 views
0

저는이 플랫폼에 익숙하지 않습니다. 선택 상자와 다른 선택 상자에 숫자 입력 필드가 있습니다. 사용자가 fieldName을 선택하여 선택하고 연산자를 선택하여 숫자를 입력하면 제출 단추가 서버에서 데이터를 가져옵니다.angularjs에서 API 호출하는 방법

var app = angular.module("app", []); 
app.controller('OutletController', function($scope, $http) { 
    $scope.minVal = ""; 
    $scope.GetFullDetails = function(outlets) { 
    $scope.outlets = []; 
    $scope.err = []; 
    $http.get("http://10.0.1.17:8080/VoucherSkout/resource/openWebApi/reports/outletStatus?" + $scope.minVal). 
    success(function(data) { 
     $scope.outlets = data; 
    }). 
    error(function(data) { 
     $scope.err = data; 
    }); 
    } 
}); 

$scope.selectField = [{ 
    displayname: "Field Name", 
    valueType: "", 
    fieldname: "" 
}, { 
    displayname: "Keyword", 
    valueType: "text", 
    fieldname: "keyword" 
}, { 
    displayname: "Offer Status", 
    valueType: "text", 
    fieldname: "offerStatus" 
}, { 
    displayname: "Start Date", 
    valueType: "date", 
    fieldname: "startDate" 
}, { 
    displayname: "End Date", 
    valueType: "date", 
    fieldname: "endDate" 
}, { 
    displayname: "Total Run Span", 
    valueType: "number", 
    fieldname: "totalRunSpan" 
}, { 
    displayname: "Foot Fall", 
    valueType: "number", 
    fieldname: "footfall" 
}]; 
$scope.selfield = $scope.selectField["0"]; 

//<------------------------------ Operator section ------------------------------------->// 
$scope.Operators = [{ 
    displayname: "Operator", 
    fieldname: "" 
}, { 
    displayname: "Greater Than", 
    fieldname: "greaterThan" 
}, { 
    displayname: "Between", 
    fieldname: "between" 
}]; 
$scope.optrfield = $scope.Operators["0"]; 
<select name="Select Field" ng-model="selfield" 
     ng-options="fld as fld.displayname for fld in selectField" 
     ng-change="selectfld()"> 
</select> 
<select name="Operators" ng-model="optrfield" 
     ng-options="opr as opr.displayname for opr in Operators" 
     ng-change="selectOptr()" ng-show="operat"> 
</select> 
<input type="number" name="min number" ng-model="minVal" 
     placeholder="Enter Value" ng-show="minN"> 

예 : 사용자 selectfield = 발걸음 및 50의 오퍼레이터 = [초과 및 입력 값을 선택하면 후 서버에서 가져와야 데이터를 제출한다.

미리 감사드립니다.

+0

무엇이 문제입니까? –

+0

angular.js를 사용하는 매개 변수가있는 HTTP GET 요청. 내 함수 내에서 매개 변수 (옵션 1 값 선택 및 옵션 2 값 및 입력 값 선택)를 사용하여 데이터를 가져올 수 있습니까? –

+0

$ http'.success' 및'.error' 메소드는 더 이상 사용되지 않습니다. 대신'.then'과'.catch' 메소드를 사용하십시오. – georgeawg

답변

0

귀하의 게시물에서 그렇게 명확하지 않으므로 무엇을하고 싶은지에 대한 가정으로 시작할 것입니다.

당신은 기본적으로 http://10.0.1.17:8080/VoucherSkout/resource/openWebApi/reports/outletStatus에서 엔드 포인트가 있고 당신은 minVal, selfieldoptrfield 같은 매개 변수 전달하려면?

이것이 질문 인 경우 몇 가지 가능성이 있습니다.

가장 쉬운 방법은 URL 문자열에 값을 지정하는 것입니다.

$http.get("http://10.0.1.17:8080/VoucherSkout/resource/openWebApi/reports/outletStatus?minVal=" + $scope.minVal + "&optrfield=" + $scope.optrfield + "&selfield="+ $scope.selfield) 

이상 깨끗하게 :

$http.get(`http://10.0.1.17:8080/VoucherSkout/resource/openWebApi/reports/outletStatus?minVal=${$scope.minVal}&optrfield=${$scope.optrfield}&selfield=${$scope.selfield}`) 

문자열 (안 컨트롤러 변수) 내부에 MINVAL, optrfield 및 selfield는 서버 코드에서 메서드 매개 변수와 일치 할 필요가 있습니다.

또한,이 같은 그것을 항상 할 수

var request = { 
    url: 'http://10.0.1.17:8080/VoucherSkout/resource/openWebApi/reports/outletStatus', 
    method: 'GET', 
    data: { 
    minVal: $scope.minVal, 
    optrfield: $scope.optrfield, 
    selfield: $scope.selfield 
    } 
} 

$http(request) 
//rest of your code 

자세한 내용은이 link을 확인하시기 바랍니다.

관련 문제