quickstart-ng2
quickstart-ng2 copied to clipboard
DEPRECATED -- See https://github.com/ui-router/quickstart-angular
Deprecated in favor of Angular-CLI starter: https://github.com/ui-router/quickstart-angular
UI-Router for Angular 2 QuickStart Source
Start development
Install the npm packages described in the package.json and verify that it works:
git clone https://github.com/ui-router/quickstart-ng2.git
cd quickstart-ng2
npm install
npm run tsc
npm start
UI-Router for NG2 quickstart highlights:
- We're using npm and systemjs. We added a dependency on latest
ui-router-ng2in package.json - Import UI-Router classes directly from
"ui-router-ng2" - Either bootstrap a
UIViewcomponent, or add a<ui-view></ui-view>viewport to your root component. - Create application states (as defined by Ng2StateDeclaration]]) which will fill in the
ui-viewviewports with component. - Create a
UIRouterConfigand apply any router config in theUIRouterConfig.configure()function. - Bootstrap a
@UIRouterModule. Provide UI-Router using theprovideUIRouterhelper.
Foo module
- Simple nested views
- Update browser hash value
Bar module
- Resolve data from server (bar list)
- Query parameter
- Nested view (bar detail renders inside bar list)
Baz module
- This module is lazy loaded using a "Future State" with a
lazyLoadfunction - Resolve data from server (baz list)
- Path parameter
- View targeting (baz detail replaces the baz list)
You're ready to write your application.
Remember the npm scripts in package.json:
npm start- runs the compiler and a server at the same time, both in "watch mode".npm run tsc- runs the TypeScript compiler once.npm run tsc:w- runs the TypeScript compiler in watch mode; the process keeps running, awaiting changes to TypeScript files and re-compiling when it sees them.npm run lite- runs the lite-server, a light-weight, static file server, written and maintained by John Papa and Christopher Martin with excellent support for Angular apps that use routing.npm run typings- runs the typings tool.npm run postinstall- called by npm automatically after it successfully completes package installation. This script installs the TypeScript definition files this app requires.
(This repo is forked from https://github.com/angular/quickstart)