Перезагрузить страницу в angular 2

Я только начинаю с angular 2. У меня проблема с перезагрузкой страницы. После завершения загрузки страницы я перехожу на другую страницу и нажимаю кнопку «Назад», страница автоматически перезагружается. Кто-нибудь, помогите мне, как это предотвратить?


angularjs reload
person Haitr    schedule 23.05.2017    source источник
comment
Что произошло после нажатия кнопки «Назад»? и то, что вам нужно?   -  person geminiousgoel    schedule 23.05.2017
comment
мне нужно, чтобы эта страница не перезагружалась снова, потому что она загружается первой, когда я запускаю веб-сайт   -  person Haitr    schedule 23.05.2017
comment
проясните, при нажатии кнопки «Назад», какие страницы перезагружаются? уже загруженная страница или последняя страница? объясняй понятно, не путай вещи!   -  person geminiousgoel    schedule 23.05.2017
comment
Хорошо, позвольте мне объяснить ясно, чтобы вы поняли. Когда я запускаю свой веб-сайт, на его домашней странице есть панель навигации. И я нажимаю панель навигации, чтобы перейти на вторую страницу, затем нажимаю кнопку «Назад», домашняя страница перезагружается снова. Как это предотвратить?   -  person Haitr    schedule 23.05.2017

Ответы (2)


arrow_upward
0
arrow_downward

Вы должны использовать router-outlet для настройки своих состояний, чтобы страница не обновлялась.

Angular Router позволяет переходить от одного представления к другому, когда пользователи выполняют задачи приложения.

Подробнее о Routing and Navigation

person Sajeetharan    schedule 23.05.2017
comment
Спасибо за вашу поддержку, но все данные, которые я получаю с сервера, не являются локальными. Пробовал с локальными данными, работает нормально - person Haitr; 23.05.2017
comment
неважно, откуда вы берете данные - person Sajeetharan; 23.05.2017
comment
я не знаю почему, но когда я работаю с локальными данными, у меня нет проблем - person Haitr; 23.05.2017
comment
const route: Routes = [ {путь: '', компонент: HomepageComponent}, {путь: 'tintuc/:category', компонент: TrangTinTongHopComponent}, {путь: 'noidung/:route/:id/:title', компонент: TrangNoiDungComponent}, {путь: 'hoidap', компонент: TrangHoiDapComponent}, {путь: 'trangnguoidung', компонент: TrangNguoiDungComponent}, {путь: 'tracuudiemthi', компонент: TrangXemDiemComponent}]; @NgModule({импорт: [RouterModule.forRoot(маршруты)], экспорт: [RouterModule] }) - person Haitr; 23.05.2017

arrow_upward
0
arrow_downward

Вы проверили свой RouterModule, например,

@NgModule({
    bootstrap: [ AppComponent ],
    declarations: [
        AppComponent,
        HomeComponent,
        HeaderComponent,
        MenuComponent,
        LoginComponent,
        RegistrationComponent
    ],
    imports: [
        UniversalModule, // MUST BE FIRST IMPORT. THIS AUTOMATICALLY IMPORTS BROWSERMODULE, HTTPMODULE, AND JSONPMODULE TOO.
        RouterModule.forRoot([
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: 'home', component: HomeComponent },
            { path: 'login', component: LoginComponent },
            { path: 'registration', component: RegistrationComponent },
            { path: '**', redirectTo: 'home' }
        ]),
        FormsModule,
        ReactiveFormsModule
    ]
})

И добавлен в app.component как

<div class='row'>
    <router-outlet></router-outlet>
</div>

И подобное для маршрутизатора-розетки выглядит так,

<div class='main-nav'>
    <div class='navbar navbar-inverse'>
        <div class='navbar-collapse collapse'>
            <ul class='nav navbar-nav'>
                <li [routerLinkActive]="['link-active']">
                    <a class='navbar-brand' [routerLink]="['/home']">
                         <span class='glyphicon glyphicon-home'></span> Logo
                    </a>
                </li> 
                <li [routerLinkActive]="['link-active']">
                    <a [routerLink]="['/login']">
                        <span class='glyphicon glyphicon-Tab1'></span> Login
                    </a>
                </li> 
                <li [routerLinkActive]="['link-active']">
                    <a [routerLink]="['/registration']">
                        <span class='glyphicon glyphicon-Tab2'></span> Register
                    </a>
                </li> 
                <li [routerLinkActive]="['link-active']">
                    <a [routerLink]="['/Tab3']">
                        <span class='glyphicon glyphicon-Tab3'></span> Tab3
                    </a>
                </li> 
            </ul>          
        </div>
    </div>
</div>

Я надеюсь, что это поможет вам.

person Anil Singh    schedule 23.05.2017
comment
Спасибо за вашу поддержку, но мой код такой же, просто отличается от того, что я связываю данные с сервера для создания панели навигации. - person Haitr; 23.05.2017