前言 目前市面上关于 Angular Material 的后台框架比较少,大多都是收费主题,而且都不太好用. 很多人都说 Material 是一个面向 C 端的框架,其实在使用其它框架做管理系统的时候,我发现 Material 的组件基本已经够用了,其它不足的地方可以配合一些优秀的第三方库.另外,Material 的确是一个高质量的组件库,不管是设计思路还是使用方式,都近乎完美. 经过一个多月的设计与思考,我开发了这款基于 Angular Material 的中后台管理框架,初期架构设计已经完成…

ng-alain 是一个企业级中后台前端/设计解决方案脚手架,我们秉承 Ant Design 的设计价值观,目标也非常简单,希望在Angular上面开发企业后台更简单.更快速.随着『设计者』的不断反馈,将持续迭代,逐步沉淀和总结出更多设计模式和相应的代码实现,阐述中后台产品模板/组件/业务场景的最佳实践,也十分期待你的参与和共建. 如何阅读文档 在开始之前有一些文档描述约定说明,这有助于更好的阅读: API相关 [] 表示属性 () 表示事件 [()] 表示双向绑定 ng-content 表示组…

自 Extensions 组件库发布以来,Data Grid 成为了使用及咨询最多的组件.最开始 Data Grid 的设计非常简陋,经过一番重构,组件质量有了质的提升. Extensions 组件库: https://github.com/ng-matero/extensions Data Grid 示例: https://ng-matero.github.io/extensions/data-grid 距离 Data Gird 重构已经过去了两个多月,因工作忙碌而迟迟没有介绍 Data Gr…

年前无聊,想自己搭建一个后台管理框架,对比了easyui.Extjs.H-ui.H+UI.layui几个框架,easyui和Extjs虽然功能强大但是界面实在是接受不了,H+UI和layuiAdmin是收费的,layui界面确实做的不错,于是想着用layui做一个极简的后台(菜单+选项卡). 先上图 前两张图是自己按照layAdmin样式写的,后一张图是从网上找的然后稍加修改. 需要的留个邮箱. 注意:前两张图选项卡内容是采用的ajax方式,后一张图采用的iframe方式.我的代码里面后台用的d…

前言 Angular Material 作为 Angular 的官方组件库,无论是设计交互还是易用性都有着极高的质量.正如官方所说其目的就是构建基于 Angular 和 Typescript 的高质量组件库. 官方列举了如下几点来解释"高质量"的含义. 国际化和可访问性,以便所有用户都可以使用. 不会让开发人员感到困惑的简单 API. 在各种各样没有 bug 的用例中按预期行事. 通过单元测试和集成测试更好地测试行为. 可在 Material Design 规范的范围内进行定制. 将性…

Angular Material 的设计之美   Ng-Matero 0.3 已发布,新增 module schematic 以及 page schematic,详见 README 前言 Angular Material 作为 Angular 的官方组件库,无论是设计交互还是易用性都有着极高的质量.正如官方所说其目的就是构建基于 Angular 和 TypeScript 的高质量组件库. 官方列举了如下几点来解释“高质量”的含义. 国际化和可访问性,以便所有用户都可以使用. 不会让开发人员感到困…

背景 之前项目使用过vue.js+iview,习惯了后端开发的我,总觉得使用不习惯,之前分析易企秀前端代码,接触到了angular js,完备的相关功能,类似后端开发的体验,让人耳目一新,全新的angular拥抱typescript,更是为后端开发量身打造, 学习angular,可以参考学习笔记: Angular快速学习笔记(4) -- Observable与RxJS Angular快速学习笔记(3) -- 组件与模板 Angular快速学习笔记(2) -- 架构 Angular 快速学习笔记(…

1 创建项目 1.1 版本说明 1.2 创建模块 1.2.1 核心模块 该模块只加载一次,主要存放一些核心的组件及服务 ng g m core 1.2.1.1 创建一些核心组件 页眉组件:header ng g c core/header --module core 内容组件:main ng g c core/main --module core 页脚组件:footer ng g c core/footer --module core 1.2.1.2 如何让核心模块只加载一次 在核心模块对应类中…

官网: https://material.io/design/ https://meterial.io/components 优秀的Meterial design站点: http://materialdesignblog.com/ 并不是万能的,都有约束条件. 优点:兼容性好,可扩展性强,可测试性好,对主题的支持好. 缺点:组件不是特别丰富. 安装: //其它方式$ sudo cnpm i --save @angular/material@2.0.0-beta.7 $ sudo yarn add…

前言 Angular Material(下称Material)的组件样式至少是可以满足一般的个人开发需求(我真是毫无设计天赋),也是Angular官方推荐的组件.我们通过用这个UI库来快速实现自己的idea. 在上节中我们安装了Angular,并新建了一个简单工程.这节中我们将会将Material导入工程中,简单写一个HelloWorld的例子,并讲解Angular模块中的declarations.imports.providers以及bootstrap等概念. 环境安装 Material简单说…