2
Я использую бета (ресурсы, которые они имеют на официальном учебнике)Дублированный История браузера Государство - маршрутизатор Угловое 2
В моем угловыми приложение, при навигации приложения в определенных точках я должен щелкнуть назад дважды чтобы фактически вернуться - почти так же, как если бы одна и та же страница дважды переводилась в историю браузера.
Я не могу понять, является ли это ошибкой Angular 2 или если в моем коде есть что-то фанки.
Например, следующий URL-адрес, введенный непосредственно в адресную строку или перенесенный в приложение, потребует дважды нажать кнопку «Назад», чтобы фактически вернуться: http://localhost:3000/products/strollers (product-list.component).
Вот код, который я думаю актуальна:
app.component.ts
// imports and whatnot
// ...
@Component({
selector: 'rz-app',
templateUrl: 'app/views/wrap.html',
directives: [
ROUTER_DIRECTIVES,
NavComponent,
CartWidgetComponent,
PreloaderComponent
],
providers: [
ROUTER_DIRECTIVES,
NavServices,
CartServices,
FavoriteServices
]
})
@RouteConfig([
{
path: '/',
name: 'Home',
component: TilesComponent,
useAsDefault: true
},
{
path: '/home',
name: 'Home',
component: TilesComponent,
},
{
path: '/categories',
name: 'Categories',
component: CategoryComponent
},
{
path: '/category/:slug',
name: 'Category',
component: ProductListComponent
},
{
path: '/pro-shop',
name: 'The Pro Shop',
component: StorefrontComponent
},
{
path: '/world-traveler',
name: 'The World Traveler',
component: StorefrontComponent
},
{
path: '/products/:slug',
name: 'ProductsList',
component: ProductListComponent
},
{
path: '/products',
name: 'Products',
component: ProductListComponent
},
{
path: '/product/:slug/:id',
name: 'Product',
component: ProductComponent
}
])
export class AppComponent {
продукт-list.component.ts
@Component({
selector: 'rz-product-list',
directives: [SortComponent, SearchComponent, ROUTER_DIRECTIVES],
pipes: [SortPipe, SearchPipe],
templateUrl: 'app/views/products-list.html'
})
export class ProductListComponent {
// default title
title = 'Product';
products;
sortValue;
searchValue;
/* for rz-sort */
sort_options = [
{
label: "Lowest Price First",
sortBy: "points",
},
{
label: "Highest Price First",
sortBy: "-points",
},
{
label: "Brand Z-A",
sortBy: "-brand",
},
{
label: "Brand A-Z",
sortBy: "brand",
},
{
label: "Product Name Z-A",
sortBy: "-name",
},
{
label: "Product Name A-Z",
sortBy: "name",
}
];
// constructor of services
constructor(
private _router: Router,
private _routeParams: RouteParams,
private _favService: FavoriteServices
{ }
// initialize
ngOnInit() {
var _param;
_param = this._routeParams.params.slug;
this.getProducts(_param);
this.title = _param;
}
// ...
}
index.html
<html>
<head>
<base href="/">
<title>Sriracha!!!</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css">
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/grids-responsive-min.css">
<link rel="stylesheet" href="dist/assets/css/structure.css">
<link rel="stylesheet" href="dist/assets/css/styles.css">
<link rel="stylesheet" href="dist/assets/css/skins/minimal.css">
<link rel="stylesheet" href="dist/assets/css/skins/tiles.css">
<link rel="stylesheet" href="dist/assets/css/skins/usb.css">
<!-- 1. Load libraries -->
<!-- IE required polyfills, in this exact order -->
<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="node_modules/systemjs/dist/system-polyfills.js"></script>
<script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/router.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
dist: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('dist/main')
.then(null, console.error.bind(console));
</script>
</head>
<!-- 3. Display the application -->
<body>
<rz-app>
<!-- Can't use preloader component here :(-->
<div class="preloader-modal">
<div class="preloader-content">
<img src="dist/assets/images/preloader.gif"/>
<p>Loading...</p>
</div>
</div>
</rz-app>
</body>
</html>
Не знаю, что происходит, какие-либо предложения?
сделал этот вопрос был зафиксирован или оно еще не завершено? Я тоже получаю эту ошибку на стабильной версии с угловым2 – Basit
С тех пор было как минимум 2 перезаписи маршрутизатора. Все проблемы были закрыты, потому что маршрутизатор, к которому они обращались, больше не поддерживается. Я не нашел аналогичную проблему для текущего маршрутизатора. Если вы можете воспроизвести в Plunker, создайте новый отчет об ошибке. –
У меня есть такая же проблема на нашем веб-сайте с последней стабильной версией углового, которая больше не является RC. но я не уверен, как воспроизвести его, я не эксперт в угловой2. – Basit