首页 文章

如何将数据从组件传递到服务

提问于
浏览 次
-1

我正在进行一个post http调用以使用服务 . 我必须在post调用中传递一个数据，但该数据是我给输入字段的值 . 我能够获取该输入字段的值组件，但我如何将该值传递给我的服务，以便它在那里可用 . 我的服务

getValidUser(userId) : Observable<Response>{
let postdata = {
    'isContractor': false,
    "assetNo" : "",
    "assetType" : "",
    "ifAnycustodian" : ""
  }
    let headers      = new Headers({ 'Content-Type': 'application/json' }); 
        let options       = new RequestOptions({ headers: headers }); 
return this.http.post('http://localhost:60623/AssetServices.svc/ValidUser/',userId,postdata).map((res:Response) => res.json())
                         //...errors if any
                         .catch((error:any) => Observable.throw(error.json().error || 'Server error'))
}

HTML代码

<div class="col-xs-12 col-lg-6 col-md-6 col-sm-6 no_pad">
  <label class="col-xs-12 no_pad">Primary user</label>
  <form class="col-xs-12 pdngLeft0 example-form">
    <mat-form-field class="col-xs-12 no_pad example-full-width">
      <input matInput #emp
        placeholder="Enter employee no/email ID/AD ID" 
        (change) ="validateuser()"
        (keyup)="onKey(emp.value)"
        name ="empno" [(ngModel)]="empno" class="col-xs-12 no_pad">
    </mat-form-field>
  </form>
</div>

我的组件

import { Component, OnInit} from '@angular/core';
import {MatDialog} from '@angular/material';
import { FileUploader } from 'ng2-file-upload';
const URL = 'https://evening-anchorage-3159.herokuapp.com/api/';
import{AssetService} from './asset.service';
import {KeysPipe} from './keys.pipe';
import {ObjtoarrPipe} from './objtoarr.pipe';

@Component({
  selector: 'app-my-asset-page',
  templateUrl: './my-asset-page.component.html',
  styleUrls: ['./my-asset-page.component.css']
})
export class MyAssetPageComponent implements OnInit {
  public empno : string;

  onKey(value: string) { // with type info
    this.empno = value;
    console.log(this.empno);
  }
  constructor(private assetser : AssetService) { }

  validateuser() {
    this.assetser.getValidUser(this.empno).subscribe(res=> {
      this.validuser = res;
      this.isval = JSON.parse(this.isval);
      console.log(this.isval);
    }, error => {
      console.log(error);
    })
  }
}

我的服务回复

{"IsUserValidResult":"{\"RequestStatus\":\"SUCCESS\",\"Message\":null,\"Response\":{\"UserId\":\"aj296828\",\"FirstName\":\"Ajay\",\"LastName\":\"Suvarna\",\"Email\":\"ajay.suvarna@xyz.com\",\"FullName\":\"Ajay Suvarna\",\"IsInvalid\":false,\"IsGroup\":false,\"IsContractor\":false,\"Manager\":\"nokhi\",\"EmployeeNo\":1123456,\"SAPStatus\":null,\"EmployeeGroup\":null},\"PageSize\":15,\"UID\":null,\"AdditionalAssetsCount\":0}"}
angular

1 回答

  • 0

    在您的服务中，您的方法接受的变量称为 emp ，但您正在创建并发布名为 empid 的局部变量 . 您需要通过 emp 变量发送到API .

    请看下面的内容 .

    getValidUser(emp) : Observable<Response> {
  return this.http.post('http://localhost:60623/AssetServices.svc/ValidUser/', emp)
    .map((res:Response) => res.json())
    //...errors if any
    .catch((error:any) =>
      Observable.throw(error.json().error || 'Server error'))
}

    编辑：

    在看到您需要将对象发送到您的API后，请参阅以下内容：

    getValidUser(emp) : Observable<Response> {
  let postdata = {
     UserId: emp
     isContractor: false,
     assetNo : "",
     assetType : "",
     ifAnycustodian : ""
  };

  return this.http.post('http://localhost:60623/AssetServices.svc/ValidUser/', postdata)
    .map((res:Response) => res.json())
    //...errors if any
    .catch((error:any) =>
      Observable.throw(error.json().error || 'Server error'))
}
    回复于

相关问题