即使第一次数据看起来不错,Aurelia绑定也不会更新

时间:2017-05-10 19:42:18

标签: javascript binding aurelia

我是Aurelia的新手,遇到了一个有约束力的问题。我试图查看有关Aurelia绑定的帖子,但没有看到类似的特定内容。

这很可能是一个新手的错误,但我被卡住了,因为Chrome开发人员工具控制台中没有报告错误/警告。

我有一个典型的列表,注入了一个存根web-api。     从'./web-api'导入{WebAPI};     从'aurelia-framework'导入{inject};

@inject(WebAPI)
export class LtvRequestList {
  constructor(api) {
    this.api = api;
    this.selectedId = 'initid';
    //this.ltvRequests = [];
    this.ltvRequests = [  {
    requestId: '11111-a',
    accounts: ["account0", "account1"],
    proposalId: 1257,
    userId: 'user-id-0',
    eventTime: 135511540000
  }];
  }

  searchLtvRequests(keywords, endTime) {
    this.api.getLtvRequests(keywords, endTime)
        .then(
          ltvRequests => this.setLtvRequests(ltvRequests));
  }

  setLtvRequests(requests) {
    // for (var req in requests) {
    //   this.ltvRequests.push(req);
    // }
    console.info("before set, id", this.selectedId);
    this.selectedId='callBackId';
    this.ltvRequests = requests;

    console.info("set ltv requests, id = ", this.selectedId);

    console.info("set ltv requests, length = ", this.ltvRequests.length);

  }
  select(ltvRequest) {
    this.selectedId = ltvRequest.requestId;
    return true;
  }

  get canRequestList() {
      return !this.api.isRequesting;
  }
}

我有一个html模板

<template>
  <div class="request-list">
    <span>length: ${ltvRequests.length}, selected: ${selectedId}</span>
    <ul class="list-group">
      <li repeat.for="request of ltvRequests" class="list-group-item ${request.requestId === $parent.selectedId ? 'active' : ''}">
          <h4 class="list-group-item-heading"><span>${$index+1}. accounts: </span><span>${request.accounts[0]}</span></h4>
          <p class="list-group-item-text"><span>eventTime: </span><span>${request.eventTime}</span></p>
          <p class="list-group-item-text"><span>proposalId: </span><span>${request.proposalId}</span></p>
          <p class="list-group-item-text"><span>requestId: </span><span>${request.requestId}</span></p>
      </li>
    </ul>
  </div>
</template>

绑定最初会起作用,因为您可以看到我为ltvRequests数组添加了一个元素,所有字段包括长度和id将显示在页面中。然后在页面中我有一个按钮,使用单击并触发searchLtvRequests。我可以验证回调是否正常,因为我在setLtvRequests回调中输出数组长度(将变为2)和相关信息。但是,html页面永远不会更新新值......

同样,在chrome开发人员工具控制台中没有报告任何错误,同样的问题出现在safari中。

我想知道我是否犯了一些真正的新手......

[编辑]我在Github here快速上传了玩具应用程序。只需快速说明,在启用“搜索”按钮之前,需要在关键字输入框中放置一些随机单词。

0 个答案:

没有答案