NativeScript 自动完成来自远程服务器的数据

Question

我正在关注this 链接以从远程服务器获取自动完成数据。

我将 NativeScript 与 Angular 一起使用。这是我对给定代码的更改返回我

未处理的承诺拒绝：无法读取属性“jsonUrl”的 未定义;

ngOnInit() {
    this.jsonUrl = 'mycustomerurl';
    let that = this;
    let options = this.createRequestHeader();
    this.autocomplete.autoCompleteTextView.loadSuggestionsAsync = function (text) {
        const promise = new Promise(function (resolve, reject) {
          http.request({
            url: this.jsonUrl + '/' + text,
            method: "GET",
            headers: options,
           }).then(function (r: any) {
                let d = r.content;
                alert(r.content.length); // Undefined
                console.error(d); // Data exists
                alert(d.length); // Undefined
                const items: Array<TokenModel> = new Array();
                for (let i = 0; i < d.length; i++) { // Not going inside loop.
                    items.push(new TokenModel(d[i].label, null));
                }
                resolve(items);
            }).catch((err) => {
                const message = 'Error fetching remote data from ' + that.jsonUrl + ': ' + err.message;
                console.log(message);
                alert(message);
                reject();
            });
        });

        return promise;
    };

  }

private createRequestHeader() {
    // set headers here e.g.
    const tokenInfo = appSettings.getString('TokenInfo');
    let headers = new HttpHeaders({
        Authorization: `Bearer ${tokenInfo}`,
        "Content-Type": "application/json",
     });

    return headers;
  }

我从我的网址https://mysite/api/SearchName/rk 获得以下格式的远程，其中 rk 是远程过滤器的用户文本。

[
    {
        "label": "GLOBAL AGENCIES LTD",
        "id": "P000003",
    "val": "100.00"
    },
    {
        "label": "NEW MARKETING LTD",
        "id": "P000004",
    "val": "200.00"
    }
]

在用户选择标签时，我想对其“id”和“val”执行一些操作。

我还缺少什么？

Answer 1

this 在调用loadSugfestionsAsync 函数时不会指向您的组件。使用箭头函数来保留上下文或简单地使用that.jsonUrl，它已经持有对上下文的引用。