2016-01-19 17 views
12

Używam Angular 2 beta (TypeScript). Spotkałem dziwny problem. Wypróbowałem Chrome, Firefox, Opera, wszystkie te same wyniki.Problemy z * ngIf w Angular 2 (TypeScript)

Po kliknięciu przycisku "Przełącz" można z powodzeniem wyświetlić/ukryć tekst "Hello World!".

Po wysłaniu polecenia z innej przeglądarki przy użyciu gniazda, boolean "pokaż" zmienia się z powodzeniem w tle, jednak tekst nie jest wyświetlany/ukrywany, co wygląda na to, że strona nie jest odświeżana.

import {Component, View} from 'angular2/core'; 
import {bootstrap} from 'angular2/bootstrap'; 
import {NgIf} from 'angular2/common'; 

@Component({ 
    selector: 'app' 
}) 
@View({ 
    directives: [NgIf], 
    template: ` 
     <button (click)="clicked()">Toggle</button> 
     <div> 
     <div *ngIf="show"> 
      <h2>Hello World!</h2> 
     </div> 
     </div> 
    ` 
}) 
class App { 
    show: boolean = true; 

    constructor() { 
     Socket.on { 
      If (getMessage) { 
       this.show = !this.show; 
      } 
     } 
    } 

    clicked() { 
     this.show = !this.show; 
    } 
} 

bootstrap(App); 

Odpowiedz

12

Myślę, że to problem związany ze Strefą. Ten ostatni jest odpowiedzialny za powiadomienie firmy Angular, że musi obsługiwać aktualizację.

To pytanie może dać ci kilka wskazówek: View is not updated on change in Angular2.

można spróbować coś takiego:

export class App { 
    constructor(ngZone:NgZone) { 
    this.ngZone = ngZone; 
    Socket.on { 
     this.ngZone.run(() => 
     If (getMessage) { 
      this.show = !this.show; 
     } 
     }); 
    } 
    } 

    } 

To pytanie może być również związane z problemu: Angular2 child property change not firing update on bound property.

Nadzieję, że to pomaga, Thierry

8

Wydaje kod Socket biegnie poza Angulars strefy. Wstrzykuj NgZone i używaj zone.run(...) tak Kątowej, aby uświadomić kątowi konieczność wykrycia zmiany.

+0

Dziękuję bardzo za szybką reakcję! To działa! Zarówno twoje, jak i thierry są poprawne. Mam nadzieję, że rozumiesz, że mogę wybrać tylko jedną odpowiedź. –

+0

@HongboMiao to dobrze, bez obaw :) –

+0

Thx, który działał! – Albernazf

Powiązane problemy