2016-12-26 3 views
0

Мое приложение в angular2 было полностью функциональным компонентом загрузки после компонента. Когда я попытался использовать его с электроном, все пошло вниз. Я стараюсь следовать различным учебникам, но они не работают для меня. Может ли кто-нибудь указать мне, почему это не работает, пожалуйста.Angular2 Маршруты с электроном не работают

index.html внутри приложения/

<html> 
<head> 
    <meta charset="utf-8"> 
    <title>QuizzUmmah</title> 
    <base href="/"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="icon" type="image/x-icon" href="favicon.ico"> 
    </head> 
<body> 
<h1>Index On</h1> 
<app></app> 

<script src="../node_modules/angular2/bundles/angular2-polyfills.js"></script> 
<script src="../build/common.js"></script> 
<script src="../build/angular2.js"></script> 
<script src="../build/app.js"></script> 
</body> 
</html> 

App.ts внутри приложения/запуска/

///<reference path="../../node_modules/angular2/typings/browser.d.ts"/> 
import {bootstrap} from "angular2/platform/browser"; 
import { Component, provide } from "angular2/core"; 
import { ROUTER_DIRECTIVES, RouteConfig, Router, ROUTER_PROVIDERS } from 'angular2/router'; 
import { APP_BASE_HREF,HashLocationStrategy, Location, LocationStrategy } from '@angular/common'; 
import { Control } from 'angular2/common'; 
import { HomeComponent } from '../home/home.component'; 

@RouteConfig([ 
{ path: '/home', component: HomeComponent, name: 'HomeComponent' }, 
{ path: '/**', redirectTo: ['HomeComponent'] } 
]) 

@Component({ 
    selector: "app", 
    template:`<h1>Working</h1> 
    <router-outlet></router-outlet>`, 
    directives: [ROUTER_DIRECTIVES], 
}) 

export class App {} 

bootstrap(App, [ 
    ROUTER_PROVIDERS, 
    provide(APP_BASE_HREF, { useValue: '/' }), 
    provide(LocationStrategy, { useClass: HashLocationStrategy }) 
]); 

HomeComponent внутри приложения/дома

import { Component} from '@angular/core'; 
    import { Router } from '@angular/router'; 

    @Component({ 
    selector: 'app-home', 
    template: `<h1>Home is working</h1>`, 
    }) 
    export class HomeComponent{ 

    constructor(){} 

    } 
+0

Каковы ваши ошибки? если это связано с тем, что вы не можете найти какой-либо из ваших скриптов, то есть C: //build/app.js, попробуйте изменить свой TO crackhaus

ответ

1

Просто изменить тело из index.html файл, как показано ниже. Используйте тег <base> внутри тела без символа «/» и попробуйте.

<body> 
    <base href=""> 
    <h1>Index On</h1> 
    <app></app> 
    <script src=".....></script> 
</body> 
+0

. Я добавил тег в раздел. Он решил мою проблему, что мое приложение с одной страницей всегда показывает белую страницу, когда я пытался использовать относительную ссылку с тегом . –

+0

Я пробовал несколько комбинаций с "#/foo" "/ foo" "foo" и так далее. Все без успеха. Но это был особый случай, когда мой SPA был встроен в Electron. С пустым тегом все прекрасно и прекрасно работает. –

Смежные вопросы