Каковы преимущества и недостатки использования ui-router-ng2 вместо нового маршрутизатора Angular2? В прошлом я использовал ui-router с Angular 1.x вместо использования ngRoute, потому что мне нужна лучшая поддержка вложенных состояний/маршрутов.

Итак, а как насчет Angular2? Я хотел бы услышать от вас, поэтому я могу оценить обе возможности.

Кроме того, поиск и поиск в Google я нашел ngrx/router, что я не знал. Можете ли вы рассказать мне, какие различия между встроенным маршрутизатором Angular2, новым ui-router для Angular2 и ngrx router

Ответ 1

Общая информация

NGRX Router docs

ngrx router устарел! Существует стратегия от маршрутизатора ngrx до стандартного маршрутизатора Angular2.

Angular2 Маршрутизатор docs

Решение по умолчанию из команды Angular
Был вдохновлен UI-маршрутизатором от AngularJS
Построено для компонентов

Angular2 Маршрутизатор имеет почти все функции UI-маршрутизатора.

NG2 UI-router docs

Известный UI-маршрутизатор от AngularJS обновлен для Angular2. Из известных преимуществ - делает более плавное обновление от UL-маршрутизатора AngularJS до UI-маршрутизатора ng2.

Сравнение

Позвольте сравнить синтаксис UI-маршрутизатора обеих версий с Angular2 Router.

UI-маршрутизатор с угловым интерфейсом:

app.config(function($stateProvider){
    $stateProvider.state('home', {
        url: '/home',
        templateUrl: 'home.html',
        controller: 'HomeCtrl'
    })
});

Angular2 UI-маршрутизатор:

export let state1: Ng2StateDeclaration = {
    name: 'home',
    component: HomeComponent,
    url: '/home'
}

@NgModule({
 imports: [
   SharedModule,
   UIRouterModule.forChild({ states: [home] })
 ],
declarations: [HomeComponent]
})
export class MyModule {}

Angular2 Маршрутизатор:

Свойство

( Обновление: - name было удалено после V3-alpha7. Потому что это не сработало с ленивой загрузкой маршрутов.)

import {
    RouteConfig,
    Route
} from 'angular2/router';
import {HomeComponent} from './components/home';

@Component({})
@RouteConfig([
    new Route({ 
        path: '/home', 
        component: HomeComponent, 
        name: 'Home' // Deprecated property, works until v3-alpha7
    })
])
export class App {...}

Как мы видим, в общем случае Angular2 Router почти то же самое. В качестве дополнения нужно сказать, что он поддерживает большинство общих функций, таких как обмен статическими/динамическими данными через маршруты, вложенные представления и т.д.

Те же стратегии размещения (Path and Hash)
Подобные определения маршрутов
Похожие услуги:
- $state.go и Router.navigate
- $stateParams и RouteParams
- $state.current.data и RouteDatali >
Аналогичные директивы
- ui-view и маршрутизатор-выход
- ui-sref и routerLink

Заключение

Angular2 Маршрутизатор лучше всего воспринял опыт UI-маршрутизатора и реализовал его. Если вам нужно быстро перенести свою базу кода с помощью UL-маршрутизатора AngularJS на Angular2 быстро и плавно, вы можете попробовать Ug-маршрутизатор Ng2, в противном случае я думаю, что Angular2 Маршрутизатор подойдет лучше всего. Даже если вы решили использовать NG2 UI-router, проверьте все плюсы и минусы, в настоящий момент я чувствую, что сообщество собирается выбрать стандартное решение из команды Angular, что означает лучшую поддержку.