javascript - 使用 EventAggregator 在 Aurelia 中更新列表

标签 javascript aurelia

我正在使用 app-contacts demo 来学习 Aurelia,是的,我知道,正如@Eisenberg 所提到的,它是不完整的,但后来我想在我保存联系人或创建新联系人时使用 EventAggregator 来通知 app.js .到现在为止一切正常。我能够在 app.js 中接收联系人对象,但现在我想更新联系人列表,这不起作用,当我保存联系人并更新 app.js 中的联系人列表时,它会被删除。

在app.js中添加代码,在构造函数中调用subscribe方法。

subscribe(){
    this.ea.subscribe('contact_event', payload => {
        console.log(payload);
        var instance = JSON.parse(JSON.stringify(payload));
        let found = this.contacts.filter(x => x.id == payload.id)[0];

        if(found){
            let index = this.contacts.indexOf(found);
            this.contacts[index] = instance;
        }else{
            instance.id = this.contacts.length + 1;
            this.contacts.push(instance);
        }
    });
}

app.html 没有变化

<li repeat.for="contact of contacts" class="list-group-item ${contact.id === $parent.selectedId ? 'active' : ''}">
  <a href="#" click.delegate="$parent.select(contact)">
    <h4 class="list-group-item-heading">${contact.firstName} ${contact.lastName}</h4>
    <p class="list-group-item-text">${contact.email}</p>
  </a>
</li>

如何更新列表?

更新 这对我有用,但不确定什么是正确的方法

subscribe(){    
  this.ea.subscribe('contact_event', payload => {
    return this.api.getContactList().then(contacts => {
      this.contacts = contacts;
    });
  });
}

最佳答案

Eric L. Anderson 在他的博文中很好地解释了它的工作原理: Aurelia's Event Aggregator .这与您尝试执行的代码类型相同!

注意:现在回答 Kishore 的问题可能为时已晚,但我正在为其他通过搜索最终来到这里的人提供链接。

关于javascript - 使用 EventAggregator 在 Aurelia 中更新列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28756193/

相关文章:

javascript - 使用 Aurelia 有条件地在选择选项中添加属性

javascript - 强制 Aurelia 使用相同组件但不同路由参数调用新路由的生命周期方法

用于绘制精美图表的 JavaScript 框架

javascript - js文件没有在客户端浏览器上更新

javascript - 在 Javascript 中将 json 数组传递给 ajax 调用

typescript - 如何在 Aurelia Validation 中为给定的 customRule 创建自定义方法

twitter-bootstrap - 在 aurelia 应用程序中使用 bootstrap(主题)javascript

javascript - JSRender - 如何有条件地渲染子模板

javascript - 添加 java 脚本后,下拉菜单无法在 Index.html 上工作

javascript - 将第 3 方 JavaScript 库 (dropzone.js) 添加到 Aurelia