2016-08-05 4 views
12

Mam przecięty router routujący z mojej strony głównej. Problem pojawia się, gdy otwiera się nowa strona, a cała składnia szablonu jest zepsuta. To są wszystkie powiązania danych, ngFors, a nawet [routerLink]. Strony otwierają się bez logiki kątowej, ale jeśli odświeżam przeglądarkę na tych mieszanych stronach, działają dobrze.Składnia wszystkich szablonów Angular2 jest zepsuta, gdy otwieram stronę za pośrednictwem mojego zakodowanego routera.

app bootstrap file

import { enableProdMode } from '@angular/core'; 
import { disableDeprecatedForms, provideForms } from '@angular/forms'; 
import { HTTP_PROVIDERS } from '@angular/http'; 
import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { LocationStrategy, HashLocationStrategy } from '@angular/common'; 
import { APP_ROUTER_PROVIDERS } from './path-to-the-router-file'; 
import { ServerGetService } from './path-to-a-service'; 
import { AppComponent } from './app/app.component'; 

// depending on the env mode, enable prod mode or add debugging modules 
if (process.env.ENV === 'build') { 
    enableProdMode(); 
} 

bootstrap(AppComponent, [ 
    HTTP_PROVIDERS, 
    APP_ROUTER_PROVIDERS, 
    { 
    provide: LocationStrategy, 
    useClass: HashLocationStrategy 
    }, 
    ServerGetService, 
    disableDeprecatedForms(), 
    provideForms() 
]).catch((err: any) => console.error(err)); 

routes file

import {provideRouter, RouterConfig} from '@angular/router'; 
import {SecondPopUpComponent} from './path-to-the-file'; 
import {firstPopUpComponent} from './path-to-the-file'; 
import {Component} from '@angular/core'; 

@Component({ 
    selector: 'mx-empty', 
    template: '<div></div>' 
}) 
class EmptyComponent {} 

export const routes: RouterConfig = 
    <RouterConfig>[ 
    { 
     path: 'second-popup', 
     component: SecondPopUpComponent 
    }, { 
     path: 'first-popup', 
     component: FirstPopUpComponent 
    }, { 
     path: '', 
     component: EmptyComponent 
    } 
    ]; 

export const APP_ROUTER_PROVIDERS = [ 
    provideRouter(routes) 
]; 

one of my popup screens (with the problem)

import {Component} from '@angular/core'; 
import {TradePurposeProperty} from './trade-purpose.objects'; 
import {Router, ROUTER_DIRECTIVES} from '@angular/router'; 
import {GlobalSettingsData} from '../../services/global-settings-data.service'; 

@Component({ 
    selector: 'my-popup', 
    templateUrl: './popup.page.html', 
    directives: [ROUTER_DIRECTIVES] 
}) 

export class TradePurposePageComponent { 
    localData: customData[] = []; 

    constructor(private router: Router, private data: GlobalData) { 
    if (data.myData) { 
     this.localData= data.myData; 
    } 
    } 

    onSubmit() { 
    this.data.myData= this.localData; 
    this.router.navigate(['']); 
    } 
} 

popup.page.html

<div class="form-popup"> 
    <div class="form-popup__overlay"></div> 
    <div class="form-popup__content"> 
    <form #dataForm="ngForm" (ngSubmit)="onSubmit()"> 
     <fieldset> 
     <legend>Properties</legend> 
     <table> 
      <thead> 
      <tr> 
      <th>first column</th> 
      <th>secondcolumn</th> 
      <th>third column</th> 
      </tr> 
      </thead> 
      <tbody> 
      <tr *ngFor='let data of localData'> 
      <td>{{data.attr1}}</td> 
      <td>{{data.attr2}}</td> 
      <td> 
       <label> 
       <input type='checkbox' [(ngModel)]='localData.isSet' [ngModelOptions]="{standalone: true}"> 
       </label> 
      </td> 
      </tr> 
      </tbody> 
     </table> 
     <div> 
      <button type="submit">OK</button> 
      <a [routerLink]="['']" >Cancel</a> 
     </div> 
     </fieldset> 
    </form> 
    </div> 
</div> 

Jedyną rzeczą, która działa w pliku podręcznym jest onSubmit(), a nawet trasami, ale pozostałe powiązania nie, a kiedy klikam na cancel, aby wykonać to, pojawia się ten błąd VM55939:84 ORIGINAL EXCEPTION: TypeError: Cannot read property 'startsWith' of undefined

jakieś pomysły co robić?

+0

Co to jest router skrócony? –

+0

'useClass: HashLocationStrategy' to tylko router, który po prostu pomyślał, że mógł mieć coś wspólnego z tym –

Odpowiedz

2

Problem polegał na tym, że ktoś w zespole dodaje tej linii w polyfills: require('zone.js/dist/zone');

wciąż nie mam pojęcia, co robi i dlaczego to łamanie aplikację, ale kiedy usunięto go, wszystko działało

Powiązane problemy