0

データベースからデータをサブスクライブした直後に UI を更新できません。どこかをクリックする必要があります。

また、ルーターを使用して別のページに移動しても機能しません

@Component({
  selector: 'foo-component',
  template: `
    {{foo}}
  `
})
export class FooComponent extends MeteorComponent {
  foo: string ;

  constructor() {
    super();

    this.subscribe('messages', () => {
      // I cannot change foo value immediately, I have to click somewhere
      this.foo = 'foo';

      // Also if I use the router to go to another page, it does not work
      // this.router.navigate(['Home']);
    });
  }
}

これを解決するには?

4

1 に答える 1

1

新しい angular2-meteor バージョン autoBindはデフォルトで true に設定されていることに注意してください。したがって、おそらくこの問題に再び遭遇することはありません。

ただし、 Accounts.changePassword または他の同様の Accounts.foo() 関数で NgZone を使用する必要があります。


この問題は、コードの一部が Angular 2 ゾーンの外で実行されるためです。ゾーン内で実行して UI をすぐに更新するか、ルーターを使用して別のページに移動する必要があります。

これらの問題は通常どこで発生しますか?

ほとんどの場合、これを行いません。それで、いつこれが必要ですか?通常、Meteor 関数のコールバックで:

   this.autorun(() => {
     // here you need
   });

   this.subscribe('messages', () => {
     // here you need
   });

   this.call('newMessage', (error, result) => {
     // here you need
   });

   Accounts.changePassword(currentPassword, newPassword, error => {
     // here you need
   });

の解き方?

取った

 this.call('newMessage', (error, result) => {
   this.router.navigate(['Home']);
 });

たとえば、次のように変更する必要があります。

import { NgZone } from '@angular/core';

constructor(private zone: NgZone) {}

this.call('newMessage', (error, result) => {
  this.zone.run(() => {
    this.router.navigate(['Home']);
  });
});

きれいな方法はありますか?

幸いなことに、Angular2-Meteor は、この厄介な作業を支援します。

Angular2-Meteor API ドキュメントを確認してください。 とのautoBindパラメータがthis.subscribeありthis.autorunます。

したがって、 use は不要になり、代わりに:this.zone.runを追加するだけで済みます。true

   this.autorun(() => {
     // your code
   }, true);

   this.subscribe('messages', () => {
     // your code
   }, true);
于 2016-07-01T03:15:34.037 に答える