Ng-alain 踩坑

发表于 由hfdsoft

安装 Angular CLI

npm install -g @angular/cli

创建ng项目

ng new env-portal --style less

安装alain组件

cd env-portal
ng add ng-alain

注意，安装组件时，默认是不安装i18n模块的，但如果不安装，运行项目会报header-i18n组件缺失，所以在安装的时候一定要装上。

启动项目

npm start

添加模块

ng g ng-alain:module tenant

在模块下添加页面

ng g ng-alain:list list -m=tenant
? Specifies relative path(could be set like `bus/list`):
#直接回车，将生成/tenant/list/list.component.html和list.component.ts

在src\app\routes\routes.module.ts中导入模块

// tenant pages
import { TenantListComponent } from './tenant/list/list.component';

在src\app\routes\routes-routing.module.ts中导入模块，并在const COMPONENTS = [中加入TenantListComponent

// tenant pages
import { TenantListComponent } from './tenant/list/list.component';

并在const routes: Routes = [中加入{ path: 'tenant', component: TenantListComponent, data: { title: '租户管理' } },

最后，修改src\app\core\startup\startup.service.ts中的菜单项，添加一个菜单

          {
            text: '租户管理',
            icon: { type: 'icon', value: 'rocket' },
            link : '/tenant',
            shortcutRoot: true
          }

用户登录

示例的用户登录后端在 _mock/_user.ts中