这是一个基于Angular的常规的巧思调研在线答题程序,它来自于模板仓库os-client-demo-angular.
我们没有使用angular自带的多语言策略,而是在angular构建的基础上配置了额外的构建设置来使用了自己自定义的多语言构建策略.
基于该模块仓库新建了仓库以后需要对一下设置进行一些自定义设置
你必须非常了解如何使用巧思调研的核心包才能继续后面的主题,如果你还不了解,请先查看核心包的使用方法再继续.
从种子仓库为模板生成仓库后,需要自定义一些配置,再进行开发
- 应用程序名称:需要在
src/app/app.component.ts中的Core.setup方法的参数中设置clientName属性,这个名字需要和是设计端中选择答题渲染程序中的名字一样, - 构建配置:
build.config.js文件,请查看其中的注释.
- 我们使用了typescript进行开发,其中的类型提示和报错提供了更友好的编程环境,
- 核心包中
index.d.ts提供了暴露给UI使用的数据类型定义,当我们在控制台打印或断点调试时会发现真实的数据对象上的属性会比index.d.ts中定义的属性多很多,切记这些属性都不能在UI中使用,因为他们是核心层使用的,随时可能发生变动被移除或被修改名字,UI中只能使用index.d.ts中暴露出来的属性,这一点:正好依靠typescript的类型检测可以规避 - angular默认添加了一些额外的
tslint检查规则,来保证更持久的可维护性.如果你不喜欢上述规则,可以更改tslint.json文件中的配置来变成你想要的规则.
- 这个仓库写好以后,设计端是不知道的,所以设计端不会时候用这个程序,需要到设计端对接:把之前设置的本仓库的名称和发布后的程序地址写入到设计端主题管理器的代码中.
- 本地启动项目
- 打开设计端,发现主题管理器面板中的答题程序选择列表中会出现刚才添加的名称
- 在下拉列表中选择时候用本项目作为答题程序,然后打开预览窗口,能看到预览窗口中显示的就是本项目的页面.
- 修改一些本项目的代码,预览窗口会自动刷新.