4 ответа
С Углового Dart 2.0.0 (предвыпускная версия), правильный синтаксис для канала маршрутизатора:
<a [router-link]="['./Home']">Go Home</a>
значение является списком аргументов, которые передаются Router.navigate() .
правильный синтаксис для конфигурирования маршрутов:
@Component(
selector: 'my-app',
template: ...,
directives: const [ROUTER_DIRECTIVES],
providers: const [HeroService, ROUTER_PROVIDERS])
@RouteConfig(const [
const Route(
path: '/dashboard',
name: 'Dashboard',
component: DashboardComponent,
useAsDefault: true),
const Route(
path: '/detail/:id', name: 'HeroDetail', component: HeroDetailComponent),
const Route(path: '/heroes', name: 'Heroes', component: HeroesComponent)
])
class AppComponent {
String title = 'Tour of Heroes';
}
app/partials/phone-list.html:
<div class="container-fluid">
<div class="row">
<div class="col-md-2">
<!--Sidebar content-->
Search: <input ng-model="query">
Sort by:
<select ng-model="orderProp">
<option value="name">Alphabetical</option>
<option value="age">Newest</option>
</select>
</div>
<div class="col-md-10">
<!--Body content-->
<ul class="phones">
<li ng-repeat="phone in phones | filter:query | orderBy:orderProp" class="thumbnail">
<a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>
<a href="#/phones/{{phone.id}}">{{phone.name}}</a>
<p>{{phone.snippet}}</p>
</li>
</ul>
</div>
</div>
</div>
проверьте @ngrx/router, это - более простая реализация маршрутизатора для Углового 2 https://github.com/ngrx/router
, который Вы видите, как простой это должно объявить маршруты
import { Routes } from '@ngrx/router';
const routes: Routes = [
{
path: '/',
component: HomePage
},
{
path: '/blog',
component: BlogPage,
children: [
{
path: ':id',
component: PostPage
}
]
}
]
и здесь является демонстрационным ныряльщиком http://plnkr.co/edit/7J6RrA?p=preview
Примечание: Запуск с версии 1.2 AngularJS, ngRoute находится в ее собственном модуле и должен быть загружен путем загрузки дополнительного углового-route.js файла, который мы загружаем через Дачу выше. app/index.html:
<!doctype html>
<html lang="en" ng-app="phonecatApp">
<head>
...
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
</head>
<body>
<div ng-view></div>
</body>