TECHNOLOGIES
FORUMS
JOBS
BOOKS
EVENTS
INTERVIEWS
Live
MORE
LEARN
Training
CAREER
MEMBERS
VIDEOS
NEWS
BLOGS
Sign Up
Login
No unread comment.
View All Comments
No unread message.
View All Messages
No unread notification.
View All Notifications
Answers
Post
An Article
A Blog
A News
A Video
An EBook
An Interview Question
Ask Question
Forums
Monthly Leaders
Forum guidelines
Sujeet Raman
859
927
357.5k
Failed to save data in api server in Angular2
Apr 18 2017 8:17 AM
hi here am trying to send some values in to the api server using services in angular2 .But unable to send..Cant detect the problem ..can any one Help please?
my html
<
h1
>
Angular2 POST DEMO
h1
>
<
hr
>
<
ul
>
<
p
>
id
<
input
type
=
"text"
name
=
"ID"
[(
ngModel
)]=
"ID"
>
<
p
>
Parameter 1
<
input
type
=
"text"
name
=
"param1"
[(
ngModel
)]=
"param1"
>
<
p
>
Parameter 2
<
input
type
=
"text"
name
=
"param2"
[(
ngModel
)]=
"param2"
>
<
p
>
formula 1
<
input
type
=
"text"
name
=
"param3"
[(
ngModel
)]=
"param3"
>
<
p
>
formula 2
<
input
type
=
"text"
name
=
"param4"
[(
ngModel
)]=
"param4"
>
<
p
>
startdate
<
input
type
=
"text"
name
=
"param5"
[(
ngModel
)]=
"param5"
>
<
p
>
enddate
<
input
type
=
"text"
name
=
"param6"
[(
ngModel
)]=
"param6"
>
<
button
(
click
)=
"SendToApi(ID,param1,param2,param3,param4,param5,param6)"
>
Save
button
>
p
>
ul
>
my services
import
{
Injectable
}
from
"@angular/core"
;
import
{
Http
,
Response
,
Headers
,
RequestOptions
}
from
"@angular/http"
;
import
{
Observable
}
from
"rxjs/Rx"
;
@
Injectable
()
export
class
DemoService
{
constructor
(
private
_httpurl
:
Http
){
}
AddDetails
(
params
) {
let
headers
=
new
Headers
({
'Content-Type'
:
'application/json'
});
let
options
=
new
RequestOptions
({
headers:
headers
});
let
body
=
JSON
.
stringify
(
params
);
return
this
.
_httpurl
.
post
(
'http://uraxapiservicepoc2test.azurewebsites.net/api/Test '
,
body
,
headers
).
map
((
res
:
Response
)
=>
res
.
json
());
}
}
app.component.ts
import
{
Component
,
OnInit
}
from
'@angular/core'
;
import
{
Observable
}
from
"rxjs/Rx"
;
import
{
DemoService
}
from
'./DemoService.service'
;
import
{
Http
,
Response
,
Headers
,
RequestOptions
}
from
"@angular/http"
;
@
Component
({
selector:
'my-app'
,
templateUrl:
'../app/app.component.html'
,
providers:
[
DemoService
]
})
export
class
AppComponent
{
//public foods;
//public new_food;
public
ID
;
public
param1
;
public
param2
;
public
param3
;
public
param4
;
public
param5
;
public
param6
;
constructor
(
private
demoservice
:
DemoService
){}
SendToApi
(
ID
,
param1
,
param2
,
param3
,
param4
,
param5
,
param6
) {
console
.
log
(
ID
,
param1
,
param2
,
param3
,
param4
,
param5
,
param6
);
let
data
= {
ID:
ID
,
param1:param1
,
param2:param2
,
param3:param3
,
param4:param4
,
param5:param5
,
param6:param6
};
this
.
demoservice
.
AddDetails
(
data
).
subscribe
(
error
=>
{
console
.
error
(
"Error saving params!"
);
return
Observable
.
throw
(
error
);
}
);
}
}
Reply
Answers (
1
)
DatePicker for angularjs.
angular v1+ and asp.net mvc projects