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

删除联系人组触发。