代码之家 › 专栏 › 技术社区 › Brijesh Mavani

如何将angular 2服务中的数组传递给asp。net web API?

angular2-services asp.net-web-api2 asp.net-web-api angular

Brijesh Mavani · 技术社区 · 6 年前

我在angular 2视图侧有复选框,当我单击其中一个复选框并单击按钮时,我会得到选中复选框的值。我将这个值或id传递到服务并调用我的asp。net Web API,以下是我的观点

<div>
    <label>
         <input class="checkbox" type="checkbox" name="cbox1" value="1" >Armani                                             
    </label>           
    <label>
         <input class="checkbox" type="checkbox" name="cbox1" value="2" >Versace
    </label>
    <button type="submit" id="select" class="btn btn-default btn-sm btn-primary">Apply</button>
</div>

在我的组件中

  var self = this;            
            $(document).ready(function () {                                                         
              $('#select').click(function () {
                   var seletedId = new Array();
                    $('input:checkbox.checkbox').each(function () {
                        if ($(this).prop('checked')) {
                                       seletedId.push($(this).val());                                      
                                    }
                                    });
                                    if (seletedId.length > 0) {
                                        self.getProductBrand(seletedId);
                                    }
                                })                            
                            });

使用此调用函数

 getProductBrand(ids: Array<number>) {           
            this._productService.getProductBrand(ids).subscribe(data => {
                console.log();
            }, error => { this.errorMessage = error });
        }

在Web API中

[HttpGet]        
[Route("api/user/brand/{id}")]
public Producttbl getProduBrand([FromUri] int[] id)
{
     //
}

那么,如何从angular 2传递数组,以及如何获取web API呢? 通过上面的代码,它得到了类似于区域的错误。js:2935获取

http://localhost:58266/api/user/productbybrand/1,2 404 not found

2 回复 | 直到 6 年前

Shakeer Hussain 6 年前

尝试将值传递到url,如下所示

http://localhost:58266/api/user/productbybrand/id=1&id=2

-1

Brijesh Mavani 6 年前

首先,在typescript中创建数组

seletedIds = new Array();
然后将jquery数组分配给typescript数组并传递给web API

var self = this;            
                        $(document).ready(function () {                                                         
                            $('#select').click(function () {
                                var seletedId = new Array();
                                $('input:checkbox.checkbox').each(function () {
                                    if ($(this).prop('checked')) {
                                        seletedId.push($(this).val());                                      
                                   }
                                });
                                if (seletedId.length > 0) {
                                    self.getProductBrand(seletedId);
                                    self.seletedIds = seletedId;
                                    console.log(self.seletedIds);
                                }
                            })                            
                        });

在我的web API HttpGet更改为HttpPost之后,它就开始工作了。