fix: using ngAcceptInputType_ for count input

willmendesneto · Feb 18, 2021 · 84ea441 · 84ea441
1 parent a75ad6c
commit 84ea441
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 9 deletions.
diff --git a/projects/ngx-skeleton-loader/src/lib/ngx-skeleton-loader.component.ts b/projects/ngx-skeleton-loader/src/lib/ngx-skeleton-loader.component.ts
@@ -24,11 +24,13 @@ export class NgxSkeletonLoaderComponent implements OnInit, AfterViewInit, OnDest
 
   items: Array<any> = [];
 
+  static ngAcceptInputType_count: number | string;
+
   ngOnInit() {
     start('NgxSkeletonLoader:Rendered');
     start('NgxSkeletonLoader:Loaded');
 
-    this.items.length = this.count;
+    this.items.length = +this.count;
     const allowedAnimations = ['progress', 'progress-dark', 'pulse', 'false'];
     if (allowedAnimations.indexOf(String(this.animation)) === -1) {
       // Shows error message only in Development

diff --git a/projects/ngx-skeleton-loader/tsconfig.lib.json b/projects/ngx-skeleton-loader/tsconfig.lib.json
@@ -6,15 +6,19 @@
     "declaration": true,
     "inlineSources": true,
     "types": [],
-    "lib": ["dom", "es2018"]
+    "lib": ["dom", "es2018"],
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
   },
   "angularCompilerOptions": {
     "annotateForClosureCompiler": true,
     "skipTemplateCodegen": true,
     "strictMetadataEmit": true,
     "fullTemplateTypeCheck": true,
     "strictInjectionParameters": true,
-    "enableResourceInlining": true
+    "enableResourceInlining": true,
+    "strictTemplates": true
   },
   "exclude": ["src/test.ts", "**/*.spec.ts"]
 }
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -248,7 +248,7 @@ <h3>Skeleton using `progress-dark` animation</h3>
 
 <div class="item-with-background">
   <ngx-skeleton-loader
-    count="2"
+    [count]="count"
     [animation]="animation"
     [theme]="{
       'border-radius': '5px',

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -10,15 +10,18 @@ export class AppComponent implements OnInit, OnDestroy {
 
   animation = 'pulse';
   contentLoaded = false;
-  intervalId;
+  count = 2;
+
+  intervalId: number | null = null;
 
   ngOnInit() {
     setTimeout(() => {
       this.contentLoaded = true;
     }, 2000);
 
-    this.intervalId = setInterval(() => {
+    this.intervalId = window.setInterval(() => {
       this.animation = this.animation === 'pulse' ? 'progress-dark' : 'pulse';
+      this.count = this.count === 2 ? 5 : 2;
     }, 5000);
   }
 

diff --git a/tsconfig.app.json b/tsconfig.app.json
@@ -2,7 +2,7 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "./out-tsc/app",
-    "types": []
+    "types": ["node"]
   },
   "include": ["src/**/*.ts"],
   "files": ["src/main.ts", "src/polyfills.ts"],

diff --git a/tsconfig.json b/tsconfig.json
@@ -16,6 +16,15 @@
     "paths": {
       "ngx-skeleton-loader": ["dist/ngx-skeleton-loader"],
       "ngx-skeleton-loader/*": ["dist/ngx-skeleton-loader/*"]
-    }
+    },
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
   }
 }
diff --git a/tslint.json b/tslint.json
@@ -51,7 +51,8 @@
     "template-banana-in-box": true,
     "template-no-negated-async": true,
     "use-lifecycle-interface": true,
-    "use-pipe-transform-interface": true
+    "use-pipe-transform-interface": true,
+    "no-any": true
   },
   "rulesDirectory": ["codelyzer"]
 }