Add sample of inlining of templates & styles

Author: robisim74

src/angular-library-starter.ts

@@ -1,3 +1,4 @@
 // Public classes.
+export { SumComponent } from './components/sum.component';
 export { SumService } from './services/sum.service';
 export { ArithmeticModule } from './modules/arithmetic.module';

src/components/sum.component.html

@@ -0,0 +1,4 @@
+<div class="sum">
+    <p>Somma</p>
+    <p>{{ sum }}</p>
+</div>

src/components/sum.component.scss

@@ -0,0 +1,5 @@
+.sum {
+    p {
+        color: red;
+    }
+}

src/components/sum.component.ts

@@ -0,0 +1,20 @@
+import { Component, OnInit } from '@angular/core';
+import { SumService } from '../services/sum.service';
+
+@Component({
+    selector: 'cmp-sum',
+    templateUrl: './sum.component.html',
+    styleUrls: ['./sum.component.scss']
+})
+export class SumComponent implements OnInit {
+
+    sum: number;
+
+    constructor(private sumService: SumService) { }
+
+    ngOnInit(): void {
+        this.sumService.calculate(45, 78, 90, 674);
+        this.sum = this.sumService.sum;
+    }
+
+}

src/modules/arithmetic.module.ts

@@ -1,17 +1,20 @@
 import { NgModule, ModuleWithProviders } from '@angular/core';
 
 import { SumService } from '../services/sum.service';
+import { SumComponent } from '../components/sum.component';
 
 @NgModule({
     declarations: [
         // Pipes.
         // Directives.
         // Components.
+        SumComponent
     ],
     exports: [
         // Pipes.
         // Directives.
         // Components.
+        SumComponent
     ]
 })
 // Consider registering providers using a forRoot() method

tests/components/sum.component.spec.ts

@@ -0,0 +1,29 @@
+import { SumComponent, SumService } from '../../src/angular-library-starter';
+
+import { TestBed, ComponentFixture, async } from '@angular/core/testing';
+
+describe('Component: SumComponent', () => {
+
+    let fixture: ComponentFixture<SumComponent>;
+    let comp: SumComponent;
+
+    beforeEach(async () => {
+        TestBed.configureTestingModule({
+            imports: [],
+            providers: [
+                SumService
+            ],
+            declarations: [SumComponent]
+        }).compileComponents();
+
+        fixture = TestBed.createComponent(SumComponent);
+        comp = fixture.componentInstance;
+    });
+
+    it('should render the sum', (() => {
+        fixture.detectChanges();
+
+        expect(fixture.debugElement.nativeElement.textContent).toContain('887');
+    }));
+
+});

tslint.json

@@ -7,17 +7,17 @@
             true,
             "attribute",
             [
-                "dir-prefix1",
-                "dir-prefix2"
+                "dir",
+                "dir"
             ],
             "camelCase"
         ],
         "component-selector": [
             true,
             "element",
             [
-                "cmp-prefix1",
-                "cmp-prefix2"
+                "cmp",
+                "cmp"
             ],
             "kebab-case"
         ]