Give the more than one parameters in http request angularjs - angularjs

My Laravel route is :
Route::get('/get_event_history/{data}/{date}', 'HomeController#GetEvents')->name('get_event_history');
and I wanted to pass two routes. I am doing like this:
$scope.HistoryEventClick=function(imei,date){
var Indata = {'data': imei, 'date': date };
$http.get('/get_event_history/',params: Indata).success(function (data, status, headers, config){
console.log("Event Data from the query",data.data);
}).error(function (data, status, headers, config) {
//alert(status)
});
}
Its not working and gives error route not found

You may need to change to this:
$http.get(`/get_event_history/${imei}/${date}`).......

$http.get('/get_event_history/'+$routeParams.imei +'/date/'+ $routeParams.date)

Related

AngularJS HTTP Post Conditional in Data or Params

Understand that for POST method, the key - Data is being used instead of Params, however if the data is being used for filtering is it possible to have conditions for these Data ?
var proxyData = {
lecturer_id: "e9d0bea0-76cb-11e8-adc0-fa7ae01bbebc",
status: ["pending", "accepted"]
};
try {
$http({
method: $scope.proxyMethod,
url: url,
data: proxyData
}).
success(function(data, status, headers, config) { }).
error(function(data, status, headers, config) { });
In the above example, I would like to filter out lecturer_id with the exact match, but with status of either "pending" or "accepted".
Is it possible to do something like GET params - "?status=pending,accepted"
Thanks in advance and sorry if my question has any misunderstanding of how AngularJS works as I am still new to it.

Load JSON file from the file name passed in the parameter

I want to read data from json file. I passed the file name as parameter and try to load data from data/{{filename}}.json
But it cannot found the file and shows this error message
data/%7B%7Bfilename%7D%7D.json 404 (Not Found)
Here is my function
$scope.getSelectedCategoryData=function(fileName){
$http.get('data/{{filename}}.json')
.success(function (data) {
$scope.selectedCategoryData = data.GetAllData;
})
.error(function (data, status, headers, config) {
})
}
And my question is how can I load the file from the value passed in parameter. Is there any way like this?
<img ng-src="img/{{image}}.png"/>
The mustache notation is meant to use in html and not in Javascript. You have to follow the standard Javascript string concatenation. The below example will work for you.
$scope.getSelectedCategoryData=function(fileName){
var filePath= 'data/' + fileName +'.json';
$http.get(filePath)
.success(function (data) {
$scope.selectedCategoryData = data.GetAllData;
$scope.image=data.GetAllData.image //image path
})
.error(function (data, status, headers, config) {
})
}
Then you can use:
<img ng-src="img/{{image}}.png"/>

"Must specify grant_type field" error when getting Oauth2 token

I've got a simple node.js backend build on Restify with OAuth2 authorization (restify-oauth2 plugin).
I've got a problem requesting a token. When I call POST method with my REST client, everything works correctly and I get access_token and token_type.
The problem occurs when I try to do the same thing in my frontend aplication made in Angular.
Here's my code:
var req = {
method: 'POST',
url: 'http://localhost:8080/token',
headers: headers,
data: {},
params: {grant_type: "client_credentials"}
};
$http(req).success(function(data, status, headers, config){
console.log('success');
}).error(function(data, status, headers, config){
console.log('error');
});
So as you can see, grant_type parameter is provided. But still the server responds with:
{"error":"invalid_request","error_description":"Must specify grant_type field."}
And here's devtools screenshot:
How do I need to change my request to make it work?
I finally solved it. The thing is that grant_type field must be passed inside a request body, not in the parameters.
Working request code:
var req = {
method: 'POST',
url: 'http://localhost:8080/token',
headers: headers,
data: "grant_type=client_credentials"
};
$http(req).success(function(data, status, headers, config){
console.log('success');
}).error(function(data, status, headers, config){
console.log('error');
});

Get Count of Rows via https request

i get the data for my table via $http request like this:
$http.post('/DesktopModules/MyServices/API/PService/LoadPObjectListData', request).
success(function (data, status, headers, config) {
....
My question is, how can i display the value of loaded rows while the request pending?
I think it's not possible , while the request pending. But you can do it whild the request succeed.
html
<span>{{DataCount}}</span>
and js side
$http.post('/DesktopModules/MyServices/API/PService/LoadPObjectListData', request)
.success(function (data, status, headers, config) {
$scope.DataCount=data.length
}

Cross Domain request returns status code 0 in Firefox but 200 in Chrome

I have code in a directive that is making a cross domain request. When it runs in Chrome, it works just fine. When it runs in Firefox or IE 11, I get a status code of 0 with no data. My code is:
$http({method: 'GET', url: 'https://mycrossdomain.url'})
.success(function(data, status, headers, config) {
alert('success');
})
.error(function(data, status, headers, config) {
alert('error');
})
In Firefox and IE I get "error" alerted and in Chrome I get "success" and I can view the data.
Why would this be happening? The server obviously supports cross domain requests because it works in Chrome. When I navigate to the URL in all browsers I get a response so it definitely exists. Any help would be appreciated.
Turns out the issue was that I needed to specify withCredentials like so:
$http.get('https://mycrossdomain.url', { withCredentials: true})
.success(function(data, status, headers, config) {
alert('success');
})
.error(function(data, status, headers, config) {
alert('error');
})
This is because I needed to pass the user credentials (a certificate) to the other domain. Angular was unfortunately not providing very useful error messages.

Resources