javascript - Angular 2: Implementing HTTP POST Request -
in angular 1.x application doing following on form submit.
$scope.submit = function() { console.log('saving form data..'); $scope.selection_array = []; ( var j = 0; j < $scope.checkboxlist.length; j++ ){ if ($scope.checkboxlist[j].selected) { console.log($scope.checkboxlist[j]); $scope.selection_array.push($scope.checkboxlist[j].key); } } if ($scope.selection_array.length>0) { $http({ method : 'post', url : base_url + '/user/selection', headers : { 'content-type' : 'application/json' }, params : { access_token : localstorage.getitem("access_token") }, data : $scope.selection_array }).success(function(response) { console.log('response=>' + response); $window.alert('your items have been saved successfully'); }).error(function() { console.log('failure in updaing'); $window.alert('error saving items. please try again'); }); } else { $window.alert('please select 1 or more items'); } }
what doing here is, getting selected items checkbox list , save list database calling backend service call. need convert code angular 2.
tried
in service.ts file use following.
saveuserinterests(selected_interests) { console.log(selected_interests); var headers = new headers(); headers.append('content-type', 'application/json'); var params = new urlsearchparams(); params.set('access_token', localstorage.getitem('access_token')); return this.http.post('http://localhost:8080/user/interests', json.stringify(selected_interests), { headers: headers, search: params }).map(res => res.json()); }
then call service below in interst.ts file.
private selected_interests; onsubmit() { console.log('inside onsubmit'); var selected_interests = []; (var j = 0; j < this.interests.length; j++) { if (this.interests[j].selected) { console.log(this.interests[j]); selected_interests.push(this.interests[j].key); } else { console.log('else'); } } this.selected_interests = selected_interests; console.log(this.selected_interests); this.dataservice.saveuserinterests(this.selected_interests).subscribe( (res) => { console.log('response=>' + res); alert('your items have been saved successfully'); }, (error) => { console.log('failure in updaing'); alert('error saving items. please try again'); }); }
this gives following error on console log.
rx.js:10982 uncaught exception: error during evaluation of "ngsubmit" original exception: typeerror: cannot read property 'subscribe' of undefined original stacktrace: typeerror: cannot read property 'subscribe' of undefined
any suggestions highly appreciated
for http part, here way in angular2:
constructor(private http:http, private window:window) { } submit() { var selectionarray = (...) var headers = new headers(); headers.append('content-type' : 'application/json'); var params = new urlsearchparams(); params.set('access_token', localstorage.getitem('access_token')); this.http.post(base_url + '/user/selection', json.stringify(selectionarray), { headers : headers, search: params }).map(res => res.json()) .subscribe( (data) => { console.log('response=>' + response); this.window.alert('your items have been saved successfully'); }, (error) => { console.log('failure in updaing'); this.window.alert('error saving items. please try again'); }); }
see these links more details:
Comments
Post a Comment