abp angular 和mvc_Abp mvc angular 添加视图

在LawAndRegulation项目中添加导航路由(Abp添加菜单)对应的客户端页面。

创建文件

客户端页面在Abp模板项目中默认存放在Abp/Main/views文件夹下，在项目中我们创建属于字典管理的新文件夹，名字命名为DictionaryManger。

在文件夹中创建文件index.cshtml和同名的js文件index.js。

创建的index.cshtml文件中只需要编写页面内容部分，idnex.js中编写当前页面逻辑。

创建index.cshtml需要注意：

创建时选择“带有布局的MVC5视图页”选项，选择合适的母版(Views/Shared/_Layout.cshtml);

删除原有内容；

同样添加index.js文件。

编辑index.cshtml

在视图页面中编写你的html内容，在Abp母版项目中已经引入了Bootstrap，项目DictionaryManager在编写页面内容时，使用Bootstrap作为前端开发框架。

在项目的Bundle.config文件中已经通过文件夹引入的方式引入了/App/Main文件夹下所有css文件所以页面编写需要编写的css可以直接在index.cshtml项目所在目录下创建文件添加，在本项目中我们添加了dicCommon.css文件。

页面中使用Bootstrap模态框，想要详细学习模态框，请移步这里，有详细的使用介绍。

css文件中定义了很多自定义样式，这些样式中的单位存在px和em，存在这样的问题是因为部分内容继承自原有代码，还没有时间进行统一更改，单位之间换算参考链接，这部分内容还没有进行验证。按照文中介绍，默认情况下1em=16px，但em是相对单位所以如果父元素定义font-size字段那么1em=父元素定义的大小。

添加html，代码如下：

新增字典分类

新增字典

编辑

删除

导出

导入