angular 一般配置
app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {AppRoutingModule} from './app.router';
import {FormsModule} from '@angular/forms';
import {HttpModule} from '@angular/http';
import { AppComponent } from './app.component';
import { CartComponent } from './cart/cart.component';
import { DetailComponent } from './detail/detail.component';
import { IndexComponent } from './index/index.component';
import { ListComponent } from './list/list.component';
import { LoginComponent } from './login/login.component';
import { OrderConfirmComponent } from './orderConfirm/orderconfirm.component';
import { RegisterComponent } from './register/register.component';
import { UserCenterComponent } from './userCenter/usercenter.component';
import { HeaderComponent } from './utility/header/header.component';
import { FooterComponent } from './utility/footer/footer.component';
import { NotFoundComponent } from './utility/notFound/notfound.component';
@NgModule({
imports: [
AppRoutingModule,
FormsModule,
HttpModule,
BrowserModule
],
declarations: [
AppComponent,
CartComponent,
DetailComponent,
IndexComponent,
ListComponent,
LoginComponent,
OrderConfirmComponent,
RegisterComponent,
UserCenterComponent,
HeaderComponent,
FooterComponent,
NotFoundComponent
],
bootstrap: [ AppComponent ]
})
export class AppModule { }
app.router.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { IndexComponent } from './index/index.component';
const routes: Routes = [
{ path: '', component: IndexComponent },
{ path: 'index', component: IndexComponent },
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
})
export class AppRoutingModule { }
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<router-outlet></router-outlet>
`,
})
export class AppComponent { name = 'Angular'; }
相關文章
- angular環境配置及安裝Angular
- Angular-多級配置搞事情啦Angular
- angular版本更新與配置檔案問題Angular
- Angular專案路由配置與導航守衛Angular路由
- MySQL配置檔案my.ini的一般設定MySql
- 記一個angular在路由配置中管理 Angular Material Dialog(實現動態元件的彈窗顯示)Angular路由元件
- 一般格式
- Angular表格元件 GridManager-Angular-1.xAngular元件
- angular日曆外掛---- angular-daterangepickerAngular
- AngularJS、 Angular 2、Angular 4 的區別AngularJS
- 使用Angular CLI生成 Angular 5專案Angular
- 帶你瞭解 Angular 與 Angular JSAngularJS
- angular 管道Angular
- angular ChangeDetectorRefAngular
- Angular Universal:Angular 統一平臺簡介Angular
- 熱部署一般用在測試環境, 生產環境用分散式配置中心熱部署分散式
- [Angular][translate]有關Angular的變更檢測Angular
- 如何從Angular 5 App升級到Angular 6AngularAPP
- angular-devkit 中 build-angular 包的作用AngulardevUI
- Angular 從入坑到挖坑 - Angular 使用入門Angular
- angular入門Angular
- Angular元件——投影Angular元件
- angular - 表單Angular
- 使用Angular MaterialAngular
- angular踩坑Angular
- angular4Angular
- npm install angular jquery angular-ui-router normalize-cssNPMAngularjQueryUIORMCSS
- 如何建立 Angular 庫並在 Angular 應用裡呼叫Angular
- Linux一般技巧使用Linux
- Angular入門,開發環境搭建,使用Angular CLI建立你的第一個Angular專案Angular開發環境
- [Angular]在Angular中和DOM打交道的正確姿勢Angular
- Angular效能優化 – 再談Angular 4髒值檢測Angular優化
- Angular之路–帶你來搭建Webpack 2 + Angular 4專案AngularWeb
- 使用Angular-cli搭建Angular2開發環境Angular開發環境
- Angular效能優化 - 再談Angular 4髒值檢測Angular優化
- Angular 2 Forward ReferenceAngularForward
- Angular 2 constructor & ngOnInitAngularStructGo
- Angular 2 Multi ProvidersAngularIDE
- Angular 2 Components CommunicateAngular