essa-platform / es-ng-antd

Commit ee8e8c097fe8fdcbe369b49ff04cd6df42ea114d

Authored by Imshann
1 parent ddd373d9

优化CheckableTag组件

Showing 6 changed files with 41 additions and 44 deletions   Show diff stats
Inline Side-by-side
build/CheckableTag/CheckableTag.html
  Show/Hide comments   View file @ee8e8c0
1   -<span ng-class="'ant-tag ant-tag-checkable'+(checked==='true'?' ant-tag-checkable-checked':'')" ng-click="handleClick()" ng-transclude></span>
2 1 \ No newline at end of file
  2 +<span ng-class="'ant-tag ant-tag-checkable'+(checked===true?' ant-tag-checkable-checked':'')" ng-click="handleClick()" ng-transclude></span>
3 3 \ No newline at end of file
... ...
build/CheckableTag/CheckableTag.js
  Show/Hide comments   View file @ee8e8c0
1   -import template from "./CheckableTag.html";
2 1 import style from "antd/lib/tag/style/index.css";
3   -angular.module("esNgAntd").directive("antdCheckableTag", function (esNgAntd) {
4   - return {
5   - controllerAs: "antdCheckableTag",
6   - restrict: "E",
7   - transclude: true,
8   - replace: true,
9   - scope: {
10   - checked: "@",
11   - onChange: "&",
12   - },
13   - template: template,
14   - controller: function ($scope, $element, $attrs) {
15   - this.getContext = function () {
16   - return $scope;
17   - };
18   -
19   - $scope.handleClick = function () {
20   - $scope.onChange({
21   - checked: !($scope.checked === "true"),
22   - });
23   - };
24   - },
25   - link: function ($scope, $element, $attrs, $controllers, $transclude) {
26   - esNgAntd.createStyle("ant-tag", style);
27   - },
28   - };
29   -});
  2 +import template from "./CheckableTag.html";
  3 +angular.module("esNgAntd").directive("antdCheckableTag", ["esNgAntd", function (esNgAntd) {
  4 + return {
  5 + template: template,
  6 + restrict: "E",
  7 + replace: true,
  8 + transclude: true,
  9 + scope: {
  10 + checked: "=",
  11 + onChange: "&"
  12 + },
  13 + controller: function ($scope) {
  14 + $scope.handleClick = function () {
  15 + $scope.onChange({
  16 + checked: !($scope.checked === true)
  17 + });
  18 + };
  19 + },
  20 + link: function ($scope) {
  21 + esNgAntd.createStyle("ant-tag", style);
  22 + }
  23 + };
  24 +}]);
30 25 \ No newline at end of file
... ...
dist/ng-antd.js
  Show/Hide comments   View file @ee8e8c0
... ... @@ -71,7 +71,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd
71 71 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
72 72  
73 73 "use strict";
74   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _CheckableTag_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./CheckableTag.html */ \"./build/CheckableTag/CheckableTag.html\");\n/* harmony import */ var antd_lib_tag_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/tag/style/index.css */ \"./node_modules/antd/lib/tag/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdCheckableTag\", function (esNgAntd) {\n return {\n controllerAs: \"antdCheckableTag\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n checked: \"@\",\n onChange: \"&\",\n },\n template: _CheckableTag_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.handleClick = function () {\n $scope.onChange({\n checked: !($scope.checked === \"true\"),\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-tag\", antd_lib_tag_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/CheckableTag/CheckableTag.js?");
  74 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd_lib_tag_style_index_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! antd/lib/tag/style/index.css */ \"./node_modules/antd/lib/tag/style/index.css\");\n/* harmony import */ var _CheckableTag_html__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CheckableTag.html */ \"./build/CheckableTag/CheckableTag.html\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdCheckableTag\", [\"esNgAntd\", function (esNgAntd) {\n return {\n template: _CheckableTag_html__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n restrict: \"E\",\n replace: true,\n transclude: true,\n scope: {\n checked: \"=\",\n onChange: \"&\"\n },\n controller: function ($scope) {\n $scope.handleClick = function () {\n $scope.onChange({\n checked: !($scope.checked === true)\n });\n };\n },\n link: function ($scope) {\n esNgAntd.createStyle(\"ant-tag\", antd_lib_tag_style_index_css__WEBPACK_IMPORTED_MODULE_0__[\"default\"]);\n }\n };\n}]);\n\n//# sourceURL=webpack://ng-antd/./build/CheckableTag/CheckableTag.js?");
75 75  
76 76 /***/ }),
77 77  
... ... @@ -9485,7 +9485,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
9485 9485 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
9486 9486  
9487 9487 "use strict";
9488   -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 = \"<span ng-class=\\\"'ant-tag ant-tag-checkable'+(checked==='true'?' ant-tag-checkable-checked':'')\\" ng-click=\\"handleClick()\\" ng-transclude></span>\";\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (code);\n\n//# sourceURL=webpack://ng-antd/./build/CheckableTag/CheckableTag.html?");
  9488 +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 = \"<span ng-class=\\\"'ant-tag ant-tag-checkable'+(checked===true?' ant-tag-checkable-checked':'')\\" ng-click=\\"handleClick()\\" ng-transclude></span>\";\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (code);\n\n//# sourceURL=webpack://ng-antd/./build/CheckableTag/CheckableTag.html?");
9489 9489  
9490 9490 /***/ }),
9491 9491  
... ...
example/checkable-tag.html
  Show/Hide comments   View file @ee8e8c0
... ... @@ -9,7 +9,7 @@
9 9 <body>
10 10 <div ng-app="esNgAntd" ng-controller="mainCtrl">
11 11 <div class="container" style="padding: 50px">
12   - <es-checkable-tag ng-repeat="(key, tag) in tags" checked="{{tag.checked}}" on-change="handleChange(checked, key)">{{tag.label}}</es-checkable-tag>
  12 + <antd-checkable-tag ng-repeat="(key, tag) in tags" checked="tag.checked" on-change="handleChange(checked, key)">{{tag.label}}</antd-checkable-tag>
13 13 </div>
14 14 </div>
15 15 <script src="https://cdn.staticfile.org/angular.js/1.2.28/angular.min.js"></script>
... ...
src/CheckableTag/CheckableTag.html
  Show/Hide comments   View file @ee8e8c0
1   -<span className={"ant-tag ant-tag-checkable" + (checked === "true" ? " ant-tag-checkable-checked" : "")} onClick={this.handleClick}>{children}</span>
2 1 \ No newline at end of file
  2 +<span className={"ant-tag ant-tag-checkable" + (checked === true ? " ant-tag-checkable-checked" : "")} onClick={this.handleClick}>{children}</span>
3 3 \ No newline at end of file
... ...
src/CheckableTag/CheckableTag.js
  Show/Hide comments   View file @ee8e8c0
... ... @@ -2,23 +2,25 @@ import template from &quot;./CheckableTag.html&quot;;
2 2 import style from "antd/lib/tag/style/index.css";
3 3  
4 4 class CheckableTag {
5   -
  5 +
6 6 useModules = ["esNgAntd"];
7 7  
8   - template = template;
9   -
10   - props = {
11   - checked: Boolean,
12   - onChange: Function,
  8 + constructor() {
  9 + esNgAntd.createStyle("ant-tag", style);
13 10 }
14 11  
15 12 handleClick() {
16 13 this.props.onChange({
17   - checked: !(this.props.checked==="true")
18   - })
  14 + checked: !(this.props.checked === true),
  15 + });
19 16 }
20 17  
21   - constructor() {
22   - esNgAntd.createStyle("ant-tag", style);
  18 + render() {
  19 + return template;
23 20 }
24   -}
25 21 \ No newline at end of file
  22 +}
  23 +
  24 +CheckableTag.propTypes = {
  25 + checked: PropTypes.boolean,
  26 + onChange: PropTypes.function,
  27 +};
... ...