0

1) Web API コントローラー。

    [Route("InsertRecipes")]
        public HttpResponseMessage PostRecipes(Recipes model)
        {
            db.Recipes.Add(recipes);
            db.SaveChanges();
            var message = Request.CreateResponse(HttpStatusCode.Created, model);
            return message;
return CreatedAtRoute("DefaultApi", new { id = recipes.ID }, recipes);
        }

2) Recipes.cs (モデルクラスenter code here

[Table("tbl_Recipes")]
public class Recipes
{
    public string Name { get; set; }
    public string Description { get; set; }
    public string ImagePath { get; set; }
    public Ingredients Ingredients;

}

3) Angular で POST メソッドを呼び出す

storeRecipes(){
        const recipes = this.recipeService.getRecipes();
        this.http.post('http://localhost:62286/Api/Recipes/InsertRecipes',recipes).pipe()
                .subscribe(response =>{
                    console.log(response);
                });
    }

4) これは Angular から受け取った JSON です

 {
    "name": "Fish Curry",
    "description": "Fish Curry - taste really awesome",
    "imagePath": "https://ichef.bbci.co.uk/food/ic/food_16x9_1600/recipes/fish_curry_09718_16x9.jpg",
    "ingredients": [
      {
        "name": "Green Chilli",
        "amount": 5
      },
      {
        "name": "Fish",
        "amount": 1
      },
      {
        "name": "Ginger Galic Paste",
        "amount": 1
      },
      {
        "name": "Onion",
        "amount": 2
      },
      {
        "name": "Tomato",
        "amount": 2
      },
      {
        "name": "Master",
        "amount": 3
      },
      {
        "name": "Masala",
        "amount": 2
      }
    ]
  }

angular から投稿している間は常に、そのコントローラーのモデルで null を受け取ります。

4

2 に答える 2

0

と を使用する必要がFromBodyあり[HttpPost]ます。モデル (ここではレシピ) を http リクエストの本文に入れているため、 body から受け取る必要があります。

PostRecipes次のように Web API を変更します。

  [Route("InsertRecipes")]
  [HttpPost]
        public HttpResponseMessage PostRecipes([FromBody]Recipes model)
        {
            db.Recipes.Add(recipes);
            db.SaveChanges();
            var message = Request.CreateResponse(HttpStatusCode.Created, model);
            return message;
return CreatedAtRoute("DefaultApi", new { id = recipes.ID }, recipes);
        }

次に、角度サービスで：

public storeRecipes() {
    // make sure that recipes is not null ....
    const recipes = this.recipeService.getRecipes();
    this.http.post('http://localhost:62286/Api/Recipes/InsertRecipes', recipes, this.setHttpHeader()).pipe()
        .subscribe(response => {
            console.log(response);
        });
}
private setHttpHeader() {
    const headers = new HttpHeaders().set('Accept', 'application/json').set('Content-Type', 'application/json');
    let options = { headers: headers };
    return options;
}
于 2019-12-03T22:09:06.990 に答える