Identity Server 4 principles and practical (end) _ established Angular client







https://material.angular.io/

first CLI is installed Angular




--prefix = AC: Prefix
--routing: default routing
style = scss: style uses SCSS
--dry -run an analog of this process, but the actual these files are not generated on





no simulation is to remove the back of the --dry -run

adjust the text size

-o is to open a browser

using npm run start it is also possible

the emergence of this screen is the normal

use of the official ui

number of dependent libraries installed

Another method of installation, the installation will depend on a number of projects are configured


to select a default style



material dependencies are also installed on the



default has been configured

in step 4 has been loaded with the default style file

10 minutes and 20 seconds

using the method



will navbar generate a folder in the components folder

all components beginning with AC




ng serve -o see the results

on the right side of the middle portion of the discharge container routes

to the container by adding a style



suffix names are changed scss



nothing to routing pages, here the components do a





match is also not the jump to the Dashboard




Access web services using angular

web服务不需要授权

这里就先不是用数据库了,使用memory缓存

ImemoryCache注入进来

新建实体类 就三个属性








现在api1是不需要授权的

angular生成table的命令



然后是路由的配置

添加菜单

 

生成Angular的Service




先看一下效果,会生成两个文件。Spec是用于测试的



这也是Ctrl+.有一个快捷键


使用这个组件,必须现在Modules引入。app.modules.ts

写一个方法来查询所有的Todo

新建Models类来接受api返回的数据

这里是定义接口的形式


设置了返回类型,Ctrl+. 导入了引用


todos变量实现了IToDo的接口




重新编译代码

页面上线都注释掉,只看控制台的输出

跨域的错误

在api1里面添加一个策略

然后再使用mvc的Filter 添加一个Filter。针对所有的controller的都使用这个策略

然后在config里面

这句话漏了加上了 在这里重新加上

再次运行,已经可以看到前端的数据了

前端的代码简单的写写

我们是把数据放在todos这个变量上了。所以前台把数据源源改一下


设置只有有数据才去显示table


自定义列

添加操作

生成一个form


添加一个菜单先


增加路由

看一下生成的表单的样式效果


修改form表单的样式

ts内线保留就一个字段


Service内添加一个

再建一个add的model类

这里只需要一个title属性就可以了。



页面的ts内具体的代码




使用这个snackBar,需要在模块里面引入



提交一条数据 成功了。




api的action写上 formBody



修改页面操作成功后来个跳转


完活2019年6月1日12:54:20

Guess you like

Origin www.cnblogs.com/wangjunwei/p/10959327.html