fix: toggle case (#13)

* style:card hover

* pref:add input params

* pref:add output error message

* fix:modify angular.json

* fix:add maxselect juge

* fix:output message

* fix:css var compatible

* refactor: output message

* fea: matching elements

* doc: update readme

* fix: input params not concat

* fix: toggle case

* fix: resolve conflict

components/periodic-table.component.ts

@@ -60,26 +60,25 @@ export class MtaPeriodicTableComponent implements OnInit, OnChanges,  OnDestroy
   }
 
   ngOnChanges(): void {
-    this.initCanSelect();
-    this.canSelectElements = this.canSelectElements.concat(this.service.selectedElements);
-    this.service.setCanSelectElements(this.canSelectElements);
-  }
-
-  ngOnDestroy(): void {
-    this.change$.unsubscribe();
-  }
-
-  /**
-  * 如果不传入或为不为数组，初始化canSelectElements
-  */
-  initCanSelect () {
     if (this.canSelectElements === undefined || !(this.canSelectElements instanceof Array)) {
       this.canSelectElements = [];
       for (const key in this.e) {
         if (key) {
           this.canSelectElements.push(key);
         }
       }
+    } else {
+      this.canSelectElements = this.canSelectElements.concat(this.service.selectedElements);
+      const arr = [];
+      for (const item of this.canSelectElements) {
+        arr.push(item.toLocaleLowerCase());
+      }
+      this.canSelectElements = arr;
     }
+    this.service.setCanSelectElements(this.canSelectElements);
+  }
+
+  ngOnDestroy(): void {
+    this.change$.unsubscribe();
   }
 }

src/app/app.component.ts

@@ -18,17 +18,11 @@ export class AppComponent implements OnInit {
   ngOnInit(): void {
     this.canSelectElements = undefined;
     setTimeout( () => {
-      this.canSelectElements = ['am'];
-    }, 1000);
+      this.canSelectElements = ['AM'];
+    }, 5000);
     setTimeout( () => {
-      this.canSelectElements = ['si'];
-    }, 2000);
-    setTimeout( () => {
-      this.canSelectElements = ['be'];
-    }, 3000);
-    setTimeout( () => {
-      this.canSelectElements = ['he'];
-    }, 4000);
+      this.canSelectElements = ['SI'];
+    }, 10000);
   }
 
   aaa(e) {