如何从angular2中的WebMethod获取数据

时间:2017-01-03 04:35:23

标签: http angular

在使用Ajax的Javascript中

   $.ajax({
    type: "Get",
    url: "AttendanceMaster.aspx/GetDistinctBatch",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    datatype: "jsondata",
    async: "true",       
    success: function(response) {

    },
    error: function(response) {
        alert("(allstudent )" + response.status + ' Error ' + response.statusText);
    }
   });

尝试跟随angular2

  return this._http.get("AttendanceMast.apsx/GetDistinctBatch")
  .map((response) => response.toString());

它返回

{ "_isScalar": false, "source": { "_isScalar": false }, "operator": {} }

C#

 [System.Web.Services.WebMethod]
 public static string GetDistinctBatch()
 {      
    return "welcome Angular 2";
 }

1)如何在angular2中使用?

见下面的错误

enter image description here

3 个答案:

答案 0 :(得分:6)

您的方法只是返回Observable,它们只是作为一个函数。 Observable本质上是懒惰的。在你订阅它们之前,它们不会被执行。

AttendanceMast() {
   return this._http.get("AttendanceMast.apsx/GetDistinctBatch")
         .map((response) => response.toString()); //better do it response.json();
}

myService.AttendanceMast().subscribe(
  data => console.log(data);
)

答案 1 :(得分:4)

的DataService

getwithParamter(): Observable<JSON> {                

            this.headers = new Headers();
            this.headers.append('Content-Type', 'application/json; charset=utf-8');               

            let options = new RequestOptions({
                method: RequestMethod.Post,
                url: "AttendanceMast.aspx/HelloWorldss",                   
                headers: this.headers,
                body:{program: 'pravin'}  //same like data: "{}" in ajax
            });

           return this._http.request(new Request(options)).retry(2)
             .map((response: Response) => response.text())
            .do(data => console.log('All: ' + JSON.stringify(data)))
            .catch(this.handleError);                  

    }
  handleError(error: any) {
    console.error('An error occurred', error);
    return Promise.reject(error.message || error);
}

C#

[System.Web.Services.WebMethod]
public static string HelloWorldss(string program)
{
    return "welcome Angular" + program;
}

致电

  this.dataService.getwithParamter().subscribe(
        tradeshows => this.getwithparamter = tradeshows,
        error =>  console.error('Error: ' +error)
    );

打印此变量,显示您的输出this.getwithparamter

答案 2 :(得分:0)

我假设您正在使用WebService的标准配置。如果是这样,我相信您的问题是您正在使用Angular2的内置休息功能来访问WebService,即Soap服务,返回xml soap信封。因此404.

不幸的是,除了访问休息服务之外,还有很多工作要做。 在github上查看angular2-soap。它应该让你走上正确的轨道。