Question

我正在尝试向html显示控制台JSON响应。回复看起来像{Response: "Mobile number is not registered"}。如何显示＆＃34;手机号码未注册＆＃34;单独在html中。我正在使用angular2。

 OnSendOTP(loginIntData : LoginInterface) {

        console.log("inside send otp services");
        let data = {
                  "userName":loginIntData.mobile
                  }
        let body = JSON.stringify(data);
        let head = new Headers({
                  'Content-Type': 'application/json'
                  });


        this.http.post('url', body, {headers : head}).map(res =>  res.json()).subscribe(

          data => {
             this.data = data;
            },


                    () => {console.log("send the OTP to the registered mobile" , this.loginIntData)}, //For Success Response
                  );   


  }

Answer 1

我想你可能会打电话给某些api用于手机号码验证

组件方：

return redirect()->to($referer);

模板面：

data = {};

this.http.get('your_url').subscribe(data => {
   this.data = data;
});

Answer 2

请告诉我您的尝试。但概念是，您可以使用scope对象将组件值绑定到html

export class MaintainCOCComponent {
message:string="";

  ngOnInit()
  {
   this.message=Response;// binding service response to the object
  }
}

也应该使用您的组件初始化您的html文件，如

 @Component({
        templateUrl: './sample.component.html'
    })

然后你可以在你的html中调用那个对象。等，

<p>{{message}}</p>

Answer 3

<。> 在file.component.ts中

import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Http } from '@angular/http';
@Component({
  selector: 'app-root',
  templateUrl: 'file.component.html'
})
export class AroundmeComponent implements OnInit {
    results: Observable<any>;
    constructor(private http: Http) {
        http.get('url').subscribe((res) => this.results = res.json());
    }
   ngOnInit(): void {
    }
}

在视图中

<!-- file.component.html -->

{{results | json}}

如何在angular2中显示json响应

3 个答案: