Question

[编辑1：准备我的http请求]

我的目标是进行异步调用，将数字转换为字符串，并在浏览器中将其显示给用户。我使用aurelia-http-client拨打电话。首先，我尝试使用值转换器，然后我在这里读到你不能对这些转换器做任何异步操作。现在我尝试了课程和功能，但它似乎也没有用。这是我在* .ts文件中放入的内容（模型，使用其位置和发布引用调用web服务给出轨道的真实标题）：

interface ITrack {
    position: number;
    reference: number;
    realPosition: number
}

class Track implements ITrack {
  position: number;
  reference: number;
  realPosition: number;

  public getTitle() {
      console.log('Getting title');  
        return `This track is the ${this.realPosition} of ${this.reference}.`;

    let client = new HttpClient();
    var json_tmp;
    var realTitle = 'tmp';

    client.get('http://localhost:8800/webservice/' + this.reference)
      .then(data => {
        console.log('### START DATA');
        console.log(data.response);
        console.log('### END DATA');
        var json_tmp = JSON.parse(data.response);
        realTitle = json_tmp.tracklist[this.realPosition].title;
        console.log('### RESPONSE: ' + realTitle);
      })
      .then(function(res) {
        console.log('### we are sending: ' + realTitle);
        return(reponse);
      });

    }
}

以下是我在视图中的内容：

<span class="position">${track.realPosition}</span>/<span class="reference">${track.reference}</span>
- <span class="content">${track.getTitle()}</span></p>

＆＃34; realPosition＆＃34;和＆＃34;参考＆＃34;通过＆＃34; getTitle（）＆＃34;正确显示没有被触发，我在控制台里什么都没有......

我处理这个错误吗？提前谢谢！

Answer 1

在viewmodel中写一个activate方法，它需要一个promise，然后调用activate（）中的getTitle方法。然后页面将在加载标题后加载。

class Track implements ITrack {
    position: number;
    reference: number;
    realPosition: number;

    public activate(): Promise < void > {
        return getTitle();
    }

    public getTitle(): Promise < void > {
        console.log('Getting title');
        //here you can call the aurelia http method like this
        return httpClient.getTitle().then((data) {
            this.position = data.position;
            this.reference = data.reference;

        });

    }
}

Answer 2

我不确定这句话的使用是什么：

return `This track is the ${this.realPosition} of ${this.reference}.`;

在'return'之后函数中的所有内容都不会被执行，包括：

let client = new HttpClient();

正如其他人已经指出的那样，最好的解决方案是在activate方法中调用异步http调用，完全按照https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-typescript/src/users.ts

中Aurelia Skeleton示例的建议

之后，您只需要从模板中读取属性而无需调用任何方法

在aurelia视图中返回类的功能

2 个答案: