Question

出于某种原因，我无法从Angular项目中的请求中访问响应。即使我可以在控制台上打印，我也可以访问public class ViewModel : INotifyPropertyChanged { private ICommand _Connect; public ICommand Connect { get { _Connect = new RelayCommand( param => ConnectChip()); return _Connect; } } private PackIcon _icon = new PackIcon { Kind = PackIconKind.LanDisconnect }; public PackIcon Icon { get { return _icon; } set { _icon = value; NotifyPropertyChanged(); } } private void ConnectChip() { //change icon: Icon = new PackIcon { Kind = PackIconKind.Airballoon }; } public event PropertyChangedEventHandler PropertyChanged; private void NotifyPropertyChanged([CallerMemberName] String propertyName = "") { if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); } }和data.status，但是当我尝试data.response时，我会遇到以下问题。

我的组件：

data.response.entries

这是transportantions: any[]; //this is on the start of my component together with the rest of my variables getTransportations() { let loader = this.loadingController.create({ content: 'Getting data...' }); loader.present(); this.wpApi.getTransportations() .then(function (data) { console.log(data); if ( data.status == 200 ) { this.transportantions = data.response.entries; loader.dismiss(); } else { console.log('Something was wrong. Error status ' + data.status); } }) .catch(function (err) { loader.dismiss(); console.log('something was wrong: ' + err); }); }

的输出

console.log(data)

我得到的错误是：

{ "status": 200, "response": { "total_count": "242", "entries": [ { ... }, { ... }, { ... }, ... ] } }

Answer 1

getTransportations() {
    let loader = this.loadingController.create({
      content: 'Getting data...'
    });
    loader.present();   
    this.wpApi.getTransportations()
      .then( (data) => { // just change the function format
        console.log(data);
        if ( data.status == 200 ) {
          this.transportantions = data.response.entries;
          loader.dismiss(); 
        } else {
          console.log('Something was wrong. Error status ' + data.status);
        }  
      })
      .catch(function (err) {
        loader.dismiss(); 
        console.log('something was wrong: ' + err);
      });
  }

只需更改功能格式。

将function（）{}格式更改为this（）=＆gt; {}格式，以便访问＆＃39; this.transportantions＆＃39;;

更多关于箭头功能：的 https://www.sitepoint.com/es6-arrow-functions-new-fat-concise-syntax-javascript/

Answer 2

您必须使用arrow function而非显式function，以便将当前上下文保留在function的范围内：

getTransportations() {
    let loader = this.loadingController.create({
      content: 'Getting data...'
    });
    loader.present();   
    this.wpApi.getTransportations()
      .then((data) => {
        console.log(data);
        if ( data.status == 200 ) {
          this.transportantions = data.response.entries;
          loader.dismiss(); 
        } else {
          console.log('Something was wrong. Error status ' + data.status);
        }  
      })
      .catch(function (err) {
        loader.dismiss(); 
        console.log('something was wrong: ' + err);
      });
  }

在您的示例中，this未定义，因为您丢失了function范围内的上下文。

无法从Angular请求访问返回的数据

2 个答案: