Uirouter 1.0.0 Beta.3

This beta.3 release primarily adds support for Angular (2+).0.0 final.

AngularJS Tutorials

Angular (2+) Tutorials

Bug fixes in core

We fixed some issues in ui-router-core related to resolves and to activating/deactivating views. Thanks to those who have been reporting issues against the 1.0 code!

See the Full changelog for details.

RoadMap

1.0.0-beta.3 is the last scheduled stop before UI-Router 1.0 final!

AngularJS

UI-Router 1.0 for AngularJS is looking pretty solid. We recommend users upgrade to beta.3 immediately.

Angular (2+)

We have one major item left on the Angular (2+) todo list: Ahead of time compile support. We expect to support AoT in the near future (weeks to months).

Codebases

We’ll be moving the ui-router-core codebase out from angular-ui/ui-router to ui-router/core.

We’ll also be moving the ng2 code to its own repository.

Angular (2+) Bootstrapping (Breaking Change)

We added support for NgModule in beta.2. However, we received feedback that the custom @UIRouterModule decorator in beta.2 wouldn’t be sufficient. In beta.3, we’ve switched to an approach that closesly resembles the Angular (2+) component router.

In your app’s bootstrap, import a UIRouterModule.forRoot(). In feature modules and lazy loaded feature modules, use UIRouterModule.forChild().

Unlike the beta.2 decorator, all components (even routed components) must be listed in declarations:.

@NgModule({
  imports: [
    UIRouterModule.forRoot({
      states: INITIAL_STATES,
      useHash: true,
      configClass: MyUIRouterConfig
    }),
    BrowserModule,
    FeatureModule,
  ],
  declarations: INITIAL_COMPONENTS
})
class RootAppModule {}

@NgModule({
  imports: [
    UIRouterModule.forChild({
      states: FEATURE_STATES,
      configClass: FeatureConfig
    }),
    CommonModule,
  ],
  declarations: FEATURE_COMPONENTS
})

You can provide the forRoot() factory method an object with some declarative UI-Router configuration.

Both the forRoot() and forChild() factories can be provided a Service Class. The class will be instantiated by the dependency injector. You can inject dependencies and perform any imperative feature module configuration (much like beta.2’s UIRouterConfig).

@Injectable()
class FeatureConfig {
  constructor(router: UIRouter) {
    router.urlMatcherFactory.type('datetime', DateTimeParamType);
  }
}

For a more detailed example of how to bootstrap your application, please see the quickstart-ng2 repository

Updated:

Leave a Comment