Question

我有以下情况：

我从数据库（meteor / mongo）加载了一些内容，例如：用：

this.subscribe('cards', options, () => {
    this.cards = Cards.find({}, {sort: this.sortObject.get()});
}, true);

在模板中，我使用*ngFor="#card of cards"

迭代这些项目

当我在某个动作上扩展对象时，例如

this.cards.forEach((card:Card) => {
  card.distance = someValue;
});

模板未更新，即当我使用{{card.distance}}时，它不会显示。

是否无法扩展订阅使用meteor和angular 2的对象/列表？

Answer 1

这应该有效。这是我试过的：

class Company {
  constructor(private name:string) { }
}

@Component({
  selector: 'contacts-list',
  template: `
    <ul>
      <li *ngFor="#company of companies">{{company.name}} - {{company.distance}}</li>
    </ul>
    <div (click)="update()">Update</div>
    <ul>
      <li *ngFor="#company of rawCompanies">{{company.name}} - {{company.distance}}</li>
    </ul>
    <div (click)="updateRaw()">Update</div>
  `
})
export class ContactsList {
  constructor () {
    this.companies = [
      new Company('company 1'),
      new Company('company 2'),
      new Company('company 3'),
    ];

    this.rawCompanies = [
      { name: 'company 1' },
      { name: 'company 2' },
      { name: 'company 3' }
    ];
  }

  update() {
    this.companies.forEach((company:Company) => {
      company.name = company.name + 'a';
      company.distance = 'test';
    });
  }

  updateRaw() {
    this.rawCompanies.forEach((company) => {
      company.name = company.name + 'a';
      company.distance = 'test';
    });
  }
}

update和rawUpdate都会更新视图...是否有我遗漏的内容？

请参阅此plunkr：https://plnkr.co/edit/86i8RHYrFfRnTMMoQ1lH?p=preview。

Meteor Angular 2：ngFor在扩展模型时不会更新

1 个答案: