Commit d8d2d2b0980c756ecbeb6f56b517854d2a9c23e2
1 parent
fb741cbd
优化empty组件
Showing
6 changed files
with
43 additions
and
43 deletions
Show diff stats
build/Empty/Empty.js
| 1 | import template from "./Empty.html"; | 1 | import template from "./Empty.html"; |
| 2 | import style from "antd/lib/empty/style/index.css"; | 2 | import style from "antd/lib/empty/style/index.css"; |
| 3 | -angular.module("esNgAntd").directive("antdEmpty", function (esNgAntd) { | ||
| 4 | - return { | ||
| 5 | - controllerAs: "antdEmpty", | ||
| 6 | - restrict: "E", | ||
| 7 | - transclude: true, | ||
| 8 | - replace: true, | ||
| 9 | - scope: { | ||
| 10 | - image: "@", | ||
| 11 | - }, | ||
| 12 | - template: template, | ||
| 13 | - controller: function ($scope, $element, $attrs) { | ||
| 14 | - this.getContext = function () { | ||
| 15 | - return $scope; | ||
| 16 | - }; | ||
| 17 | - | ||
| 18 | - $scope.state = { | ||
| 19 | - image: $scope.image || "presented_image_default", | ||
| 20 | - }; | ||
| 21 | - }, | ||
| 22 | - link: function ($scope, $element, $attrs, $controllers, $transclude) { | ||
| 23 | - esNgAntd.createStyle("ant-empty", style); | ||
| 24 | - }, | ||
| 25 | - }; | ||
| 26 | -}); | 3 | +angular.module("esNgAntd").directive("antdEmpty", ["esNgAntd", function (esNgAntd) { |
| 4 | + return { | ||
| 5 | + template: template, | ||
| 6 | + restrict: "E", | ||
| 7 | + replace: true, | ||
| 8 | + transclude: true, | ||
| 9 | + scope: { | ||
| 10 | + image: "@" | ||
| 11 | + }, | ||
| 12 | + controller: function ($scope, $element) { | ||
| 13 | + $scope.state = { | ||
| 14 | + image: $scope.image || "presented_image_default" | ||
| 15 | + }; | ||
| 16 | + }, | ||
| 17 | + link: function ($scope, $element) { | ||
| 18 | + esNgAntd.clearAttribute($element[0], ["ng-class", "image"]); | ||
| 19 | + esNgAntd.createStyle("ant-empty", style); | ||
| 20 | + } | ||
| 21 | + }; | ||
| 22 | +}]); | ||
| 27 | 23 | ||
| 28 | export default { | 24 | export default { |
| 29 | - PRESENTED_IMAGE_DEFAULT: "presented_image_default", | ||
| 30 | - PRESENTED_IMAGE_SIMPLE: "presented_image_simple", | ||
| 31 | -}; | 25 | + PRESENTED_IMAGE_DEFAULT: "presented_image_default", |
| 26 | + PRESENTED_IMAGE_SIMPLE: "presented_image_simple" | ||
| 27 | +}; | ||
| 32 | \ No newline at end of file | 28 | \ No newline at end of file |
dist/ng-antd.js
| @@ -126,7 +126,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Div | @@ -126,7 +126,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Div | ||
| 126 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { | 126 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
| 127 | 127 | ||
| 128 | "use strict"; | 128 | "use strict"; |
| 129 | -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/* harmony import */ var _Empty_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Empty.html */ \"./build/Empty/Empty.html\");\n/* harmony import */ var antd_lib_empty_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/empty/style/index.css */ \"./node_modules/antd/lib/empty/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdEmpty\", function (esNgAntd) {\n return {\n controllerAs: \"antdEmpty\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n image: \"@\",\n },\n template: _Empty_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 image: $scope.image || \"presented_image_default\",\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-empty\", antd_lib_empty_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({\n PRESENTED_IMAGE_DEFAULT: \"presented_image_default\",\n PRESENTED_IMAGE_SIMPLE: \"presented_image_simple\",\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Empty/Empty.js?"); | 129 | +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/* harmony import */ var _Empty_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Empty.html */ \"./build/Empty/Empty.html\");\n/* harmony import */ var antd_lib_empty_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/empty/style/index.css */ \"./node_modules/antd/lib/empty/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdEmpty\", [\"esNgAntd\", function (esNgAntd) {\n return {\n template: _Empty_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n restrict: \"E\",\n replace: true,\n transclude: true,\n scope: {\n image: \"@\"\n },\n controller: function ($scope, $element) {\n $scope.state = {\n image: $scope.image || \"presented_image_default\"\n };\n },\n link: function ($scope, $element) {\n esNgAntd.clearAttribute($element[0], [\"ng-class\", \"image\"]);\n esNgAntd.createStyle(\"ant-empty\", antd_lib_empty_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n }\n };\n}]);\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({\n PRESENTED_IMAGE_DEFAULT: \"presented_image_default\",\n PRESENTED_IMAGE_SIMPLE: \"presented_image_simple\"\n});\n\n//# sourceURL=webpack://ng-antd/./build/Empty/Empty.js?"); |
| 130 | 130 | ||
| 131 | /***/ }), | 131 | /***/ }), |
| 132 | 132 |
example/empty.html
| @@ -15,9 +15,9 @@ | @@ -15,9 +15,9 @@ | ||
| 15 | <div ng-app="esNgAntd" ng-controller="mainCtrl"> | 15 | <div ng-app="esNgAntd" ng-controller="mainCtrl"> |
| 16 | <div class="container" style="padding: 50px"> | 16 | <div class="container" style="padding: 50px"> |
| 17 | <div> | 17 | <div> |
| 18 | - <es-empty></es-empty> | 18 | + <antd-empty></antd-empty> |
| 19 | 19 | ||
| 20 | - <es-empty image="presented_image_simple"></es-empty> | 20 | + <antd-empty image="presented_image_simple"></antd-empty> |
| 21 | </div> | 21 | </div> |
| 22 | <div> | 22 | <div> |
| 23 | </div> | 23 | </div> |
package.json
| @@ -12,7 +12,7 @@ | @@ -12,7 +12,7 @@ | ||
| 12 | "devDependencies": { | 12 | "devDependencies": { |
| 13 | "@ant-design/icons-svg": "^4.2.1", | 13 | "@ant-design/icons-svg": "^4.2.1", |
| 14 | "antd": "^4.18.2", | 14 | "antd": "^4.18.2", |
| 15 | - "beanboom": "^0.9.9", | 15 | + "beanboom": "^0.9.11", |
| 16 | "css-loader": "^6.5.1", | 16 | "css-loader": "^6.5.1", |
| 17 | "html-loader": "^3.0.1", | 17 | "html-loader": "^3.0.1", |
| 18 | "style-loader": "^3.3.1", | 18 | "style-loader": "^3.3.1", |
src/Empty/Empty.js
| @@ -2,23 +2,27 @@ import template from "./Empty.html"; | @@ -2,23 +2,27 @@ import template from "./Empty.html"; | ||
| 2 | import style from "antd/lib/empty/style/index.css"; | 2 | import style from "antd/lib/empty/style/index.css"; |
| 3 | 3 | ||
| 4 | class Empty { | 4 | class Empty { |
| 5 | - props = { | ||
| 6 | - image: String, | ||
| 7 | - }; | 5 | + |
| 6 | + useModules = ["esNgAntd"]; | ||
| 8 | 7 | ||
| 9 | state = { | 8 | state = { |
| 10 | image: this.props.image || "presented_image_default", | 9 | image: this.props.image || "presented_image_default", |
| 11 | }; | 10 | }; |
| 12 | 11 | ||
| 13 | - useModules = ["esNgAntd"]; | ||
| 14 | - | ||
| 15 | - template = template; | ||
| 16 | - | ||
| 17 | - constructor() { | 12 | + constructor($element) { |
| 13 | + esNgAntd.clearAttribute($element[0], ["ng-class", "image"]) | ||
| 18 | esNgAntd.createStyle("ant-empty", style); | 14 | esNgAntd.createStyle("ant-empty", style); |
| 19 | } | 15 | } |
| 16 | + | ||
| 17 | + render() { | ||
| 18 | + return template; | ||
| 19 | + } | ||
| 20 | } | 20 | } |
| 21 | 21 | ||
| 22 | +Empty.propTypes = { | ||
| 23 | + image: PropTypes.string, | ||
| 24 | +}; | ||
| 25 | + | ||
| 22 | export default { | 26 | export default { |
| 23 | PRESENTED_IMAGE_DEFAULT: "presented_image_default", | 27 | PRESENTED_IMAGE_DEFAULT: "presented_image_default", |
| 24 | PRESENTED_IMAGE_SIMPLE: "presented_image_simple", | 28 | PRESENTED_IMAGE_SIMPLE: "presented_image_simple", |
yarn.lock
| @@ -1320,10 +1320,10 @@ babel-plugin-polyfill-regenerator@^0.2.3: | @@ -1320,10 +1320,10 @@ babel-plugin-polyfill-regenerator@^0.2.3: | ||
| 1320 | dependencies: | 1320 | dependencies: |
| 1321 | "@babel/helper-define-polyfill-provider" "^0.2.4" | 1321 | "@babel/helper-define-polyfill-provider" "^0.2.4" |
| 1322 | 1322 | ||
| 1323 | -beanboom@^0.9.9: | ||
| 1324 | - version "0.9.9" | ||
| 1325 | - resolved "https://registry.npmmirror.com/beanboom/-/beanboom-0.9.9.tgz#a055a5d404cba9e50ada5862bec0bc7f3ae3d427" | ||
| 1326 | - integrity sha512-hEkZ2IcEXT50T20OeZiaGUjQwlGTY3vMAqVOfKd/HqRzZIXD05Jv6xeimoW43HnFs5QDOveK5n9kahimURvf3w== | 1323 | +beanboom@^0.9.11: |
| 1324 | + version "0.9.11" | ||
| 1325 | + resolved "https://registry.npmmirror.com/beanboom/-/beanboom-0.9.11.tgz#c7fffdde52738464b1771e697e4cb70359667469" | ||
| 1326 | + integrity sha512-wZFVaCz3p2WscVemcPuh316j8yWTgf78mvNeSrXNPNou1Gj3BPSutj0Z9YQ9XZSal72MbXXmF2opNb7GjZ2kxw== | ||
| 1327 | dependencies: | 1327 | dependencies: |
| 1328 | "@babel/core" "^7.12.10" | 1328 | "@babel/core" "^7.12.10" |
| 1329 | "@babel/plugin-proposal-class-properties" "^7.13.0" | 1329 | "@babel/plugin-proposal-class-properties" "^7.13.0" |