W przypadku Angular2, dlaczego dwie strony (dwie karty) mające ten sam komponent wpływają na siebie nawzajem?

Question

Jest to aplikacja Angular2, a komponent jest uproszczona tutaj:

@Component({ 
    selector: 'courses', 
    template: ` 
     <input [(ngModel)]="wahla"> 
     <input [(ngModel)]="wahla"> 
     {{ wahla }} 
     ` 
}) 
export class CoursesComponent { 
    wahla = "hmm hmm ha ha"; 
} 

myślę, że aplikacja działa poprawnie na jednej stronie z wiążącym dwukierunkowych, ale jeśli mogę otworzyć kolejną kartę z http://localhost:3000/ a następnie wklej coś lub wpisz coś w pierwszym polu wejściowym pierwszej strony, następnie druga karta jest aktualizowana dla pierwszego pola wprowadzania, podczas gdy drugie pole wejściowe i tekst statyczny nie są aktualizowane.

W pierwszej zakładce wszystko jest aktualizowane zgodnie z oczekiwaniami.

Czy to ma się stać, czy może być coś złego? To działa przy użyciu npm start, który uruchamia serwer lite z BrowserSync.

Answer 1

To jest funkcjonalność lite-server, a nie błąd lub coś takiego, jak mogłoby się wydawać.

Aby to się stało, lite-serveruses Rozszerzenie języka javascript Browsersync.

Na stronie npm lite-server jest ona wymieniona jak ten

lite-serwer jest prosty dostosowanych owijkę wokół BrowserSync aby łatwo służyć OSO.

i BrowserSync stawia go na swoich website jak ten

zsynchronizowanego testowania przeglądarki oszczędność czasu

i czyści wszystkie chmury zwątpienia

Z każdej sieci strona, urządzenie i przeglądarka, czas testu rośnie wykładniczo. Od przeładowań na żywo do przesyłu adresu URL, form replication do kliknięcia dublowania, Browsersync wycina powtarzalne zadania ręczne.

Answer 2

Możesz zmienić ustawienia synchronizacji, odwiedzając numer http://localhost:3001. Jest to interfejs użytkownika służący do zmiany ustawień synchronizacji przeglądarki. Po załadowaniu http://localhost:3001, możesz przejść do "Opcje synchronizacji" i zmienić ustawienia "Przeglądarka-Sync" tutaj.