Commit fe17acf49d81df122d587c3f3c04d1ade5a56967

Authored by Imshann
1 parent 3fe10ef1

优化组件

build/Checkbox/Checkbox.js
... ... @@ -19,8 +19,9 @@ angular.module("esNgAntd").directive("antdCheckbox", function (esNgAntd) {
19 19 };
20 20  
21 21 $scope.state = {
22   - checked: $scope.checked || $scope.defaultChecked,
  22 + checked: $scope.checked || $scope.defaultChecked || false,
23 23 disabled: false,
  24 + type: "checkbox",
24 25 };
25 26 $scope.watch = {
26 27 checked: function (newValue) {
... ... @@ -49,9 +50,28 @@ angular.module("esNgAntd").directive("antdCheckbox", function (esNgAntd) {
49 50 event: $event,
50 51 });
51 52 };
  53 +
  54 + $scope.setValue = function (value) {
  55 + if (value) {
  56 + $scope.state.checked = value;
  57 + } else {
  58 + $scope.state.checked = false;
  59 + }
  60 + };
52 61 },
  62 + require: ["?^antdForm", "?^antdFormItem"],
53 63 link: function ($scope, $element, $attrs, $controllers, $transclude) {
54   - esNgAntd.createStyle("ant-checkbox", style);
  64 + let [antdForm, antdFormItem] = $controllers;
  65 + esNgAntd.createStyle("ant-checkbox", style); // 上下文
  66 +
  67 + if (antdForm) {
  68 + $scope.antdForm = antdForm.getContext();
  69 + $scope.antdForm.state.formItems.push($scope);
  70 + }
  71 +
  72 + if (antdFormItem) {
  73 + $scope.antdFormItem = antdFormItem.getContext();
  74 + }
55 75 },
56 76 };
57 77 });
... ...
build/Common/Common.js
... ... @@ -3,6 +3,7 @@ angular.module("esNgAntd").service("esNgAntd", [
3 3 "$compile",
4 4 function ($compile) {
5 5 this.styleSheets = null;
  6 + this.conflictType = null;
6 7  
7 8 this.createStyle = function (key, style) {
8 9 if (!document.querySelector("#antd")) {
... ... @@ -11,6 +12,10 @@ angular.module("esNgAntd").service("esNgAntd", [
11 12 styleElement.setAttribute("type", "text/css");
12 13 styleElement.innerHTML = baseStyle.toString();
13 14 document.head.appendChild(styleElement);
  15 +
  16 + if (this.styleSheets) {
  17 + this.disableStyle("anticon");
  18 + }
14 19 }
15 20  
16 21 if (!document.querySelector("#" + key)) {
... ... @@ -32,17 +37,22 @@ angular.module("esNgAntd").service("esNgAntd", [
32 37  
33 38 if (
34 39 rule.selectorText &&
35   - rule.selectorText.indexOf(name) !== -1
  40 + rule.selectorText.indexOf(name) !== -1 &&
  41 + rule.selectorText.indexOf("ant3") === -1
36 42 ) {
37   - rule.selectorText = rule.selectorText.replace(
38   - /\.ant\-/g,
39   - ".disabled-ant-"
40   - );
  43 + rule.selectorText = rule.selectorText
  44 + .split(",")
  45 + .map(function (item) {
  46 + return ".ant3 " + item;
  47 + })
  48 + .join(",");
41 49 }
42 50 }
43 51 };
44 52  
45   - this.conflict = function (filename) {
  53 + this.conflict = function (filename, type) {
  54 + this.conflictType = type;
  55 +
46 56 for (let i = 0; i < document.styleSheets.length; i++) {
47 57 const element = document.styleSheets[i];
48 58  
... ...
build/Form/Form.js
... ... @@ -41,7 +41,14 @@ angular.module(&quot;esNgAntd&quot;).directive(&quot;antdForm&quot;, function (esNgAntd) {
41 41 let values = {};
42 42 $scope.state.formItems.forEach(function (item) {
43 43 let name = item.antdFormItem && item.antdFormItem.name;
44   - let value = item.value || item.state.value || null;
  44 + let value = null;
  45 +
  46 + if (item.state.type === "checkbox") {
  47 + value = item.state.checked;
  48 + } else {
  49 + value = item.value || item.state.value;
  50 + }
  51 +
45 52 values[name] = value;
46 53 });
47 54 $scope.onFinish({
... ...
dist/ng-antd.js
... ... @@ -82,7 +82,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Che
82 82 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
83 83  
84 84 "use strict";
85   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Checkbox_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Checkbox.html */ \"./build/Checkbox/Checkbox.html\");\n/* harmony import */ var antd_lib_checkbox_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/checkbox/style/index.css */ \"./node_modules/antd/lib/checkbox/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdCheckbox\", function (esNgAntd) {\n return {\n controllerAs: \"antdCheckbox\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n defaultChecked: \"@\",\n checked: \"@\",\n disabled: \"@\",\n onChange: \"&\",\n },\n template: _Checkbox_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n checked: $scope.checked || $scope.defaultChecked,\n disabled: false,\n };\n $scope.watch = {\n checked: function (newValue) {\n if (newValue !== undefined) {\n $scope.state.checked =\n newValue === \"true\" ? true : false;\n }\n },\n disabled: function (newValue) {\n if (newValue !== undefined) {\n $scope.state.disabled =\n newValue === \"true\" || newValue === \"disabled\"\n ? true\n : false;\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n\n $scope.handleClick = function ($event) {\n $scope.state.checked = !$scope.state.checked;\n $scope.onChange({\n event: $event,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-checkbox\", antd_lib_checkbox_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Checkbox/Checkbox.js?");
  85 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Checkbox_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Checkbox.html */ \"./build/Checkbox/Checkbox.html\");\n/* harmony import */ var antd_lib_checkbox_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/checkbox/style/index.css */ \"./node_modules/antd/lib/checkbox/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdCheckbox\", function (esNgAntd) {\n return {\n controllerAs: \"antdCheckbox\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n defaultChecked: \"@\",\n checked: \"@\",\n disabled: \"@\",\n onChange: \"&\",\n },\n template: _Checkbox_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n checked: $scope.checked || $scope.defaultChecked || false,\n disabled: false,\n type: \"checkbox\",\n };\n $scope.watch = {\n checked: function (newValue) {\n if (newValue !== undefined) {\n $scope.state.checked =\n newValue === \"true\" ? true : false;\n }\n },\n disabled: function (newValue) {\n if (newValue !== undefined) {\n $scope.state.disabled =\n newValue === \"true\" || newValue === \"disabled\"\n ? true\n : false;\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n\n $scope.handleClick = function ($event) {\n $scope.state.checked = !$scope.state.checked;\n $scope.onChange({\n event: $event,\n });\n };\n\n $scope.setValue = function (value) {\n if (value) {\n $scope.state.checked = value;\n } else {\n $scope.state.checked = false;\n }\n };\n },\n require: [\"?^antdForm\", \"?^antdFormItem\"],\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n let [antdForm, antdFormItem] = $controllers;\n esNgAntd.createStyle(\"ant-checkbox\", antd_lib_checkbox_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]); // 上下文\n\n if (antdForm) {\n $scope.antdForm = antdForm.getContext();\n $scope.antdForm.state.formItems.push($scope);\n }\n\n if (antdFormItem) {\n $scope.antdFormItem = antdFormItem.getContext();\n }\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Checkbox/Checkbox.js?");
86 86  
87 87 /***/ }),
88 88  
... ... @@ -137,7 +137,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
137 137 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
138 138  
139 139 "use strict";
140   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Form_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Form.html */ \"./build/Form/Form.html\");\n/* harmony import */ var antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/form/style/index.css */ \"./node_modules/antd/lib/form/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdForm\", function (esNgAntd) {\n return {\n controllerAs: \"antdForm\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n name: \"@\",\n labelCol: \"=\",\n wrapperCol: \"=\",\n onFinish: \"&\",\n form: \"=\",\n },\n template: _Form_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n formItems: [],\n };\n\n $scope.resetFields = function () {\n $scope.state.formItems.forEach(function (item) {\n if (typeof item.setValue === \"function\") {\n item.setValue(item.defaultValue || null);\n } else {\n item.value = null;\n }\n });\n };\n\n $scope.submit = function () {\n $scope.handleSubmit();\n };\n\n $scope.handleSubmit = function () {\n let values = {};\n $scope.state.formItems.forEach(function (item) {\n let name = item.antdFormItem && item.antdFormItem.name;\n let value = item.value || item.state.value || null;\n values[name] = value;\n });\n $scope.onFinish({\n values: values,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-form\", antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n\n if ($scope.form !== undefined) {\n $scope.form = $scope;\n }\n\n if ($scope.name) {\n let inputs = $element[0].querySelectorAll(\"input\");\n\n for (let i = 0; i < inputs.length; i++) {\n const element = inputs[i];\n element.id = $scope.name + \"_\" + element.id;\n }\n }\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Form/Form.js?");
  140 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Form_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Form.html */ \"./build/Form/Form.html\");\n/* harmony import */ var antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/form/style/index.css */ \"./node_modules/antd/lib/form/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdForm\", function (esNgAntd) {\n return {\n controllerAs: \"antdForm\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n name: \"@\",\n labelCol: \"=\",\n wrapperCol: \"=\",\n onFinish: \"&\",\n form: \"=\",\n },\n template: _Form_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n formItems: [],\n };\n\n $scope.resetFields = function () {\n $scope.state.formItems.forEach(function (item) {\n if (typeof item.setValue === \"function\") {\n item.setValue(item.defaultValue || null);\n } else {\n item.value = null;\n }\n });\n };\n\n $scope.submit = function () {\n $scope.handleSubmit();\n };\n\n $scope.handleSubmit = function () {\n let values = {};\n $scope.state.formItems.forEach(function (item) {\n let name = item.antdFormItem && item.antdFormItem.name;\n let value = null;\n\n if (item.state.type === \"checkbox\") {\n value = item.state.checked;\n } else {\n value = item.value || item.state.value;\n }\n\n values[name] = value;\n });\n $scope.onFinish({\n values: values,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-form\", antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n\n if ($scope.form !== undefined) {\n $scope.form = $scope;\n }\n\n if ($scope.name) {\n let inputs = $element[0].querySelectorAll(\"input\");\n\n for (let i = 0; i < inputs.length; i++) {\n const element = inputs[i];\n element.id = $scope.name + \"_\" + element.id;\n }\n }\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Form/Form.js?");
141 141  
142 142 /***/ }),
143 143  
... ... @@ -411,7 +411,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Tab
411 411 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
412 412  
413 413 "use strict";
414   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Table_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Table.html */ \"./build/Table/Table.html\");\n/* harmony import */ var antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/table/style/index.css */ \"./node_modules/antd/lib/table/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdTable\", function (esNgAntd) {\n return {\n controllerAs: \"antdTable\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n columns: \"=\",\n dSource: \"=\",\n rowSelection: \"=\",\n rowKey: \"@\",\n loading: \"@\",\n onChange: \"&\",\n size: \"@\",\n },\n template: _Table_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n size: $scope.size || \"default\",\n dataSource: [],\n selectedrecordKeys: [],\n selectedrecords: [],\n isSelectAll: false,\n rowKey: $scope.rowKey || \"id\",\n sortDirections: [\"ascend\", \"descend\"],\n sorter: {\n field: null,\n order: null,\n },\n };\n $scope.watch = {\n dSource: (newValue) => {\n if (newValue !== undefined) {\n let dataSource = [];\n newValue.forEach((record, index) => {\n let row = {};\n\n if ($scope.rowSelection) {\n row.checked = false;\n row.disabled = false;\n }\n\n if (\n $scope.rowSelection &&\n typeof $scope.rowSelection.getCheckboxProps ===\n \"function\"\n ) {\n let extraAttr =\n $scope.rowSelection.getCheckboxProps(\n record\n );\n row = Object.assign(row, extraAttr);\n }\n\n $scope.columns.forEach((column) => {\n // 排序\n if (column.sortOrder) {\n $scope.state.sorter.field = column.key;\n $scope.state.sorter.order =\n column.sortOrder;\n }\n\n row[column.key] = column.render\n ? column.render(\n record[column.key],\n record,\n index\n )\n : record[column.key];\n }); // 主键\n\n if ($scope.rowKey !== undefined) {\n row[$scope.state.rowKey] =\n record[$scope.state.rowKey];\n } else {\n row[$scope.state.rowKey] = index + 1;\n }\n\n dataSource[index] = row;\n });\n $scope.state.dataSource = dataSource;\n }\n },\n \"rowSelection.selectedRowKeys\": (newVal, oldVal) => {\n if (Array.isArray(newVal)) {\n if (newVal.length > 0) {\n console.log(\n \"this.state.dataSource\",\n $scope.state.dataSource\n );\n $scope.state.dataSource.map(function (row, key) {\n if (newVal.includes(key)) {\n row.checked = true;\n }\n });\n } else {\n $scope.state.dataSource.map(function (row, key) {\n row.checked = false;\n });\n }\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n\n $scope.handleSelectAll = function (event) {\n $scope.state.isSelectAll = event.target.checked;\n $scope.state.selectedrecordKeys = [];\n $scope.state.selectedrecords = [];\n $scope.state.dataSource.map((record, key) => {\n if (record.disabled === false) {\n record.checked = event.target.checked;\n }\n\n if (record.checked) {\n $scope.state.selectedrecordKeys.push(key);\n $scope.state.selectedrecords.push($scope.dSource[key]);\n }\n\n return record;\n });\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n };\n\n $scope.handleSelect = function (event, index) {\n let pos = $scope.state.selectedrecordKeys.findIndex(\n (value) => value === index\n );\n\n if (event.target.checked && pos === -1) {\n $scope.state.selectedrecordKeys.push(index);\n $scope.state.selectedrecords.push($scope.dSource[index]);\n } else {\n $scope.state.selectedrecordKeys.splice(pos, 1);\n $scope.state.selectedrecords.splice(pos, 1);\n }\n\n if ($scope.state.selectedrecordKeys.length === 0) {\n $scope.state.isSelectAll = false;\n }\n\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n };\n\n $scope.handleSorter = function (key) {\n $scope.state.sorter.field = key;\n\n if ($scope.state.sorter.order === null) {\n $scope.state.sorter.order = \"ascend\";\n } else if ($scope.state.sorter.order === \"ascend\") {\n $scope.state.sorter.order = \"descend\";\n } else if ($scope.state.sorter.order === \"descend\") {\n $scope.state.sorter.order = null;\n $scope.state.sorter.field = null;\n }\n\n $scope.onChange({\n sorter: $scope.state.sorter,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-table\", antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Table/Table.js?");
  414 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Table_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Table.html */ \"./build/Table/Table.html\");\n/* harmony import */ var antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/table/style/index.css */ \"./node_modules/antd/lib/table/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdTable\", function (esNgAntd) {\n return {\n controllerAs: \"antdTable\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n columns: \"=\",\n dSource: \"=\",\n rowSelection: \"=\",\n rowKey: \"@\",\n loading: \"@\",\n onChange: \"&\",\n size: \"@\",\n },\n template: _Table_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n size: $scope.size || \"default\",\n dataSource: [],\n selectedrecordKeys: [],\n selectedrecords: [],\n isSelectAll: false,\n rowKey: $scope.rowKey || \"id\",\n sortDirections: [\"ascend\", \"descend\"],\n sorter: {\n field: null,\n order: null,\n },\n };\n $scope.watch = {\n dSource: (newValue) => {\n if (newValue !== undefined) {\n let dataSource = [];\n newValue.forEach((record, index) => {\n let row = {};\n\n if ($scope.rowSelection) {\n row.checked = false;\n row.disabled = false;\n }\n\n if (\n $scope.rowSelection &&\n typeof $scope.rowSelection.getCheckboxProps ===\n \"function\"\n ) {\n let extraAttr =\n $scope.rowSelection.getCheckboxProps(\n record\n );\n row = Object.assign(row, extraAttr);\n }\n\n $scope.columns.forEach((column) => {\n // 排序\n if (column.sortOrder) {\n $scope.state.sorter.field = column.key;\n $scope.state.sorter.order =\n column.sortOrder;\n }\n\n row[column.key] = column.render\n ? column.render(\n record[column.key],\n record,\n index\n )\n : record[column.key];\n }); // 主键\n\n if ($scope.rowKey !== undefined) {\n row[$scope.state.rowKey] =\n record[$scope.state.rowKey];\n } else {\n row[$scope.state.rowKey] = index + 1;\n }\n\n dataSource[index] = row;\n });\n $scope.state.dataSource = dataSource;\n }\n },\n \"rowSelection.selectedRowKeys\": (newVal) => {\n if (Array.isArray(newVal)) {\n if (newVal.length > 0) {\n $scope.state.dataSource.map(function (row, key) {\n if (newVal.includes(key)) {\n row.checked = true;\n }\n });\n } else {\n $scope.state.dataSource.map(function (row) {\n row.checked = false;\n });\n }\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n\n $scope.handleSelectAll = function (event) {\n $scope.state.isSelectAll = event.target.checked;\n $scope.state.selectedrecordKeys = [];\n $scope.state.selectedrecords = [];\n $scope.state.dataSource.map((record, key) => {\n if (record.disabled === false) {\n record.checked = event.target.checked;\n }\n\n if (record.checked) {\n $scope.state.selectedrecordKeys.push(key);\n $scope.state.selectedrecords.push($scope.dSource[key]);\n }\n\n return record;\n });\n\n if (typeof $scope.rowSelection.onChange === \"function\") {\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n }\n };\n\n $scope.handleSelect = function (event, index) {\n let pos = $scope.state.selectedrecordKeys.findIndex(\n (value) => value === index\n );\n\n if (event.target.checked && pos === -1) {\n $scope.state.selectedrecordKeys.push(index);\n $scope.state.selectedrecords.push($scope.dSource[index]);\n } else {\n $scope.state.selectedrecordKeys.splice(pos, 1);\n $scope.state.selectedrecords.splice(pos, 1);\n }\n\n if ($scope.state.selectedrecordKeys.length === 0) {\n $scope.state.isSelectAll = false;\n }\n\n if (typeof $scope.rowSelection.onChange === \"function\") {\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n }\n };\n\n $scope.handleSorter = function (key) {\n $scope.state.sorter.field = key;\n\n if ($scope.state.sorter.order === null) {\n $scope.state.sorter.order = \"ascend\";\n } else if ($scope.state.sorter.order === \"ascend\") {\n $scope.state.sorter.order = \"descend\";\n } else if ($scope.state.sorter.order === \"descend\") {\n $scope.state.sorter.order = null;\n $scope.state.sorter.field = null;\n }\n\n $scope.onChange({\n sorter: $scope.state.sorter,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-table\", antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Table/Table.js?");
415 415  
416 416 /***/ }),
417 417  
... ... @@ -9771,7 +9771,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
9771 9771 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
9772 9772  
9773 9773 "use strict";
9774   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n// Module\nvar code = \"<div class=\\\"ant-table-wrapper\\\">\\n <div ng-class=\\\"'ant-table ant-table-'+state.size\\\">\\n <div class=\\\"ant-table-content\\\">\\n <table>\\n <thead class=\\\"ant-table-thead\\\">\\n <tr>\\n <th ng-if=\\\"rowSelection\\\" class=\\\"ant-table-selection-column\\\">\\n <span ng-if=\\\"rowSelection.hideSelectAll\\" class=\\"ant-table-header-column\\">\n <div>\n <span class=\\"ant-table-column-title\\">\n <div class=\\"ant-table-selection\\">\n <antd-checkbox on-change=\\"handleSelectAll(event)\\" checked=\\"{{state.isSelectAll}}\\" />\n </div>\n </span>\n </div>\n </span>\n </th>\n <th ng-repeat=\\"(key, column) in columns track by key\\" class=\\"ant-table-cell ant-table-column-has-sorters\\" ng-style=\\"{width:column.width}\\">\n <span ng-if=\\"!column.sorter\\">{{column.title}}</span>\n <div ng-if=\\"column.sorter\\" class=\\"ant-table-column-sorters\\" ng-click=\\"handleSorter(column.key)\\">\n <span class=\\"ant-table-column-title\\">{{column.title}}</span>\n <span class=\\"ant-table-column-sorter ant-table-column-sorter-full\\">\n <span class=\\"ant-table-column-sorter-inner\\">\n <antd-icon type=\\"CaretUpOutlined\\" ng-class=\\"'ant-table-column-sorter-up'+(state.sorter.field===column.key&&state.sorter.order==='ascend'?' active':'')\\"></antd-icon>\n <antd-icon type=\\"CaretDownOutlined\\" ng-class=\\"'ant-table-column-sorter-down'+(state.sorter.field===column.key&&state.sorter.order==='descend'?' active':'')\\"></antd-icon>\n </span>\n </span>\n </div>\n </th>\n </tr>\n </thead>\n <tbody class=\\"ant-table-tbody\\">\n <tr ng-repeat=\\"(key, record) in state.dataSource track by record[state.rowKey]\\" class=\\"ant-table-row\\">\n <td ng-if=\\"rowSelection\\" class=\\"ant-table-selection-column\\">\n <span>\n <antd-checkbox checked=\\"{{record.checked}}\\" disabled=\\"{{record.disabled}}\\" on-change=\\"handleSelect(event,$index)\\" />\n </span>\n </td>\n <td ng-repeat=\\"(key, column) in columns track by key\\" data-key=\\"{{column.key}}\\">\n <antd-slot content=\\"{{record[column.key]}}\\" context=\\"antdTable.getContext().$parent\\" />\n </td>\n </tr>\n <tr ng-if=\\"state.dataSource.length===0\\" class=\\"ant-table-placeholder\\">\n <td colspan=\\"{{rowSelection?columns.length+1:columns.length}}\\">\n <antd-empty image=\\"presented_image_simple\\"></antd-empty>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n</div>\";\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (code);\n\n//# sourceURL=webpack://ng-antd/./build/Table/Table.html?");
  9774 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n// Module\nvar code = \"<div class=\\\"ant-table-wrapper\\\">\\n <div ng-class=\\\"'ant-table ant-table-'+state.size\\\">\\n <div class=\\\"ant-table-content\\\">\\n <table>\\n <thead class=\\\"ant-table-thead\\\">\\n <tr>\\n <th ng-if=\\\"rowSelection\\\" class=\\\"ant-table-selection-column\\\">\\n <span ng-if=\\\"!rowSelection.hideSelectAll\\" class=\\"ant-table-header-column\\">\n <div>\n <span class=\\"ant-table-column-title\\">\n <div class=\\"ant-table-selection\\">\n <antd-checkbox on-change=\\"handleSelectAll(event)\\" checked=\\"{{state.isSelectAll}}\\" />\n </div>\n </span>\n </div>\n </span>\n </th>\n <th ng-repeat=\\"(key, column) in columns track by key\\" class=\\"ant-table-cell ant-table-column-has-sorters\\" ng-style=\\"{width:column.width}\\">\n <span ng-if=\\"!column.sorter\\">{{column.title}}</span>\n <div ng-if=\\"column.sorter\\" class=\\"ant-table-column-sorters\\" ng-click=\\"handleSorter(column.key)\\">\n <span class=\\"ant-table-column-title\\">{{column.title}}</span>\n <span class=\\"ant-table-column-sorter ant-table-column-sorter-full\\">\n <span class=\\"ant-table-column-sorter-inner\\">\n <antd-icon type=\\"CaretUpOutlined\\" ng-class=\\"'ant-table-column-sorter-up'+(state.sorter.field===column.key&&state.sorter.order==='ascend'?' active':'')\\"></antd-icon>\n <antd-icon type=\\"CaretDownOutlined\\" ng-class=\\"'ant-table-column-sorter-down'+(state.sorter.field===column.key&&state.sorter.order==='descend'?' active':'')\\"></antd-icon>\n </span>\n </span>\n </div>\n </th>\n </tr>\n </thead>\n <tbody class=\\"ant-table-tbody\\">\n <tr ng-repeat=\\"(key, record) in state.dataSource track by record[state.rowKey]\\" class=\\"ant-table-row\\">\n <td ng-if=\\"rowSelection\\" class=\\"ant-table-selection-column\\">\n <span>\n <antd-checkbox checked=\\"{{record.checked}}\\" disabled=\\"{{record.disabled}}\\" on-change=\\"handleSelect(event,$index)\\" />\n </span>\n </td>\n <td ng-repeat=\\"(key, column) in columns track by key\\" data-key=\\"{{column.key}}\\">\n <antd-slot content=\\"{{record[column.key]}}\\" context=\\"antdTable.getContext().$parent\\" />\n </td>\n </tr>\n <tr ng-if=\\"state.dataSource.length===0\\" class=\\"ant-table-placeholder\\">\n <td colspan=\\"{{rowSelection?columns.length+1:columns.length}}\\">\n <antd-empty image=\\"presented_image_simple\\"></antd-empty>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n</div>\";\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (code);\n\n//# sourceURL=webpack://ng-antd/./build/Table/Table.html?");
9775 9775  
9776 9776 /***/ }),
9777 9777  
... ...
example/form.html
... ... @@ -14,30 +14,33 @@
14 14 <body>
15 15 <div ng-app="esNgAntd" ng-controller="mainCtrl">
16 16 <div class="container" style="padding: 50px">
17   - <es-form name="basic" on-finish="onFinish(values)" form="form">
18   - <es-form-item label="username" name="username">
19   - <es-input></es-input>
20   - </es-form-item>
21   - <es-form-item label="area" name="area">
22   - <es-select>
23   - <es-select-option value="aaa">AAA</es-select-option>
24   - <es-select-option value="bbb">BBB</es-select-option>
25   - </es-select>
26   - </es-form-item>
27   - <es-form-item>
28   - <es-button type="primary" html-type="submit">Submit</es-button>
29   - <es-button type="primary" html-type="button" ng-click="onReset()">Reset</es-button>
30   - </es-form-item>
31   - </es-form>
  17 + <antd-form name="basic" on-finish="onFinish(values)" form="form">
  18 + <antd-form-item label="username" name="username">
  19 + <antd-input></antd-input>
  20 + </antd-form-item>
  21 + <antd-form-item label="area" name="area">
  22 + <antd-select>
  23 + <antd-select-option value="aaa">AAA</antd-select-option>
  24 + <antd-select-option value="bbb">BBB</antd-select-option>
  25 + </antd-select>
  26 + </antd-form-item>
  27 + <antd-form-item label="area" name="checkbox">
  28 + <antd-checkbox>Checkbox</antd-checkbox>
  29 + </antd-form-item>
  30 + <antd-form-item>
  31 + <antd-button type="primary" html-type="submit">Submit</antd-button>
  32 + <antd-button type="primary" html-type="button" ng-click="onReset()">Reset</antd-button>
  33 + </antd-form-item>
  34 + </antd-form>
32 35  
33   - <!-- <es-form label-col="{span:10}" wrapper-col="{span:14}">
34   - <es-form-item label="username">
35   - <es-input></es-input>
36   - </es-form-item>
37   - <es-form-item label="password">
38   - <es-input></es-input>
39   - </es-form-item>
40   - </es-form> -->
  36 + <!-- <antd-form label-col="{span:10}" wrapper-col="{span:14}">
  37 + <antd-form-item label="username">
  38 + <antd-input></antd-input>
  39 + </antd-form-item>
  40 + <antd-form-item label="password">
  41 + <antd-input></antd-input>
  42 + </antd-form-item>
  43 + </antd-form> -->
41 44 </div>
42 45 </div>
43 46 <script src="https://cdn.staticfile.org/angular.js/1.2.28/angular.min.js"></script>
... ...
src/Checkbox/Checkbox.js
... ... @@ -14,8 +14,9 @@ class Checkbox {
14 14 };
15 15  
16 16 state = {
17   - checked: this.props.checked || this.props.defaultChecked,
  17 + checked: this.props.checked || this.props.defaultChecked || false,
18 18 disabled: false,
  19 + type: "checkbox"
19 20 };
20 21  
21 22 watch = {
... ... @@ -34,12 +35,29 @@ class Checkbox {
34 35 },
35 36 };
36 37  
  38 + constructor(antdForm, antdFormItem) {
  39 + esNgAntd.createStyle("ant-checkbox", style);
  40 +
  41 + // 上下文
  42 + if (antdForm) {
  43 + this.antdForm = antdForm.getContext();
  44 + this.antdForm.state.formItems.push($scope);
  45 + }
  46 + if (antdFormItem) {
  47 + this.antdFormItem = antdFormItem.getContext();
  48 + }
  49 + }
  50 +
37 51 handleClick($event) {
38 52 this.state.checked = !this.state.checked;
39 53 this.props.onChange({ event: $event });
40 54 }
41 55  
42   - constructor() {
43   - esNgAntd.createStyle("ant-checkbox", style);
  56 + setValue(value) {
  57 + if (value) {
  58 + this.state.checked = value;
  59 + } else {
  60 + this.state.checked = false;
  61 + }
44 62 }
45 63 }
... ...
src/Common/Common.js
... ... @@ -5,6 +5,8 @@ angular.module(&quot;esNgAntd&quot;).service(&quot;esNgAntd&quot;, [
5 5 function ($compile) {
6 6 this.styleSheets = null;
7 7  
  8 + this.conflictType = null;
  9 +
8 10 this.createStyle = function (key, style) {
9 11 if (!document.querySelector("#antd")) {
10 12 let styleElement = document.createElement("style");
... ... @@ -12,6 +14,9 @@ angular.module(&quot;esNgAntd&quot;).service(&quot;esNgAntd&quot;, [
12 14 styleElement.setAttribute("type", "text/css");
13 15 styleElement.innerHTML = baseStyle.toString();
14 16 document.head.appendChild(styleElement);
  17 + if (this.styleSheets) {
  18 + this.disableStyle("anticon");
  19 + }
15 20 }
16 21 if (!document.querySelector("#" + key)) {
17 22 let styleElement = document.createElement("style");
... ... @@ -30,17 +35,21 @@ angular.module(&quot;esNgAntd&quot;).service(&quot;esNgAntd&quot;, [
30 35 let rule = this.styleSheets.cssRules[i];
31 36 if (
32 37 rule.selectorText &&
33   - rule.selectorText.indexOf(name) !== -1
  38 + rule.selectorText.indexOf(name) !== -1 &&
  39 + rule.selectorText.indexOf("ant3") === -1
34 40 ) {
35   - rule.selectorText = rule.selectorText.replace(
36   - /\.ant\-/g,
37   - ".disabled-ant-"
38   - );
  41 + rule.selectorText = rule.selectorText
  42 + .split(",")
  43 + .map(function (item) {
  44 + return ".ant3 " + item;
  45 + })
  46 + .join(",");
39 47 }
40 48 }
41 49 };
42 50  
43   - this.conflict = function (filename) {
  51 + this.conflict = function (filename, type) {
  52 + this.conflictType = type;
44 53 for (let i = 0; i < document.styleSheets.length; i++) {
45 54 const element = document.styleSheets[i];
46 55 if (element.href && element.href.indexOf(filename) !== -1) {
... ...
src/Form/Form.js
... ... @@ -52,7 +52,12 @@ class Form {
52 52 let values = {};
53 53 this.state.formItems.forEach(function (item) {
54 54 let name = item.antdFormItem && item.antdFormItem.name;
55   - let value = item.value || item.state.value || null;
  55 + let value = null;
  56 + if (item.state.type === "checkbox") {
  57 + value = item.state.checked;
  58 + } else {
  59 + value = item.value || item.state.value
  60 + }
56 61 values[name] = value;
57 62 });
58 63 this.props.onFinish({
... ...