README
Wynn Select Receivers
自定义元素(Web Elements) wynn-select-receiver 的源代码。
测试
在 app.module.ts
文件的 bootstrap
加上 TestComponent
,运行 ng serve --open --port 4201
可以在 http://localhost:4201
看到测试效果。
Build
编译之前去掉 app.module.ts
文件中 bootstrap
中的 TestComponent
。执行 ng build
编译项目,输出文件在 dist/
目录下。
dist/
文件夹下有一个 test.html
可以用来测试编译过后的代码。
使用
安装
执行 npm install wynn-select-receiver
引入(原生项目中使用)
<link href="wynn-select-receivers/styles.css" rel="stylesheet">
<script src="wynn-select-receivers/main.js"></script>
<script src="wynn-select-receivers/polyfills.js"></script>
<script src="wynn-select-receivers/runtime.js"></script>
<script src="wynn-select-receivers/vendor.js"></script>
必要的配置
属性|内容 --|:--: options|配置 contacts|单个联系人 contactGroups|联系人组
options 中的必填配置
字段名称 | 内容 | |
---|---|---|
type | 'email'、'phone'、'QQ' 三选一,代表联系人的类型 | |
primaryKey | 联系人的唯一标识 | |
display | 用于展示的字段 | |
valueKey | 内容字段 | |
groupPrimaryKey | 联系人组的唯一标识 |
options 中的可选配置:languages
languages: {
dialogTitle: '选择收信人',
search: '搜索',
cancelButton: '取消',
OkButton: '确定',
personTitle: '联系人',
createPerson: '新建联系人',
deletePerson: '删除联系人',
personNameField: '备注',
personValueField: '邮箱地址',
groupTitle: '联系人组',
createGroup: '新建联系人组',
deleteGroup: '删除联系人组',
groupNameFiled: '组名称',
groupMemberFiled: '组成员',
selectPersons: '选择组成员',
repeatTip: '已存在',
invalidTip: '无效'
}
method
done
选好所需的联系人之后点击确定触发。
personCreated
新建单个联系人触发。
personUpdated
编辑单个联系人触发。
personDeleted
删除单个联系人触发。
groupCreated
创建联系人组触发。
groupUpdated
编辑联系人组触发。
groupDeleted
删除联系人组触发。