Angularjs4.0命令创建一个配置好路由的项目
本帖最后由 幽梦林子 于 2017-8-11 11:38 编辑Angularjs4.0如何命令创建一个配置好路由的项目呢？请看以下介绍：1.命令创建项目
ng new demo02 –-routing
详细代码请看最下方图片。
2.创建需要的组件
ng g component home
ng g component news
ng g component newscontent
3.找到app-routing.module.ts 配置路由
引入组件
import { HomeComponent } from './home/home.component';
import { NewsComponent } from './news/news.component';
import { NewscontentComponent } from './newscontent/newscontent.component';
配置路由
const routes: Routes = [
{path: 'home', component: HomeComponent},
{path: 'news', component: NewsComponent},
{path: 'newscontent/:id', component: NewscontentComponent},
{
path: '',
redirectTo: '/home',
pathMatch: 'full'
}
];
4.找到app.component.html根组件模板，配置router-outlet显示动态加载的路由
<h1>
<a routerLink="/home">首页</a>
<a routerLink="/news">新闻</a>
</h1>
<router-outlet></router-outlet>
页:
[1]