Angular osztályok

• Szerző: Sallai András
• Copyright © Sallai András, 2021, 2022
• Licenc: CC Attribution-Share Alike 4.0 International
• Web: https://szit.hu

ng generate class Valami

A parancs hatására két állomány jön létre a következő helyen:

• src/app/valami.ts
• src/app/valami.spec.ts

src/app/valami.ts

export class Valami {
}

src/app/valami.spec.ts

import { Valami } from './valami';
 
describe('Valami', () => {
  it('should create an instance', () => {
    expect(new Valami()).toBeTruthy();
  });
});

Készítsünk egy Triangle nevű osztályt, amely a következő adattagokat tartalmazza:

• alap
• magasság
• terület

Hozzunk létre olyan metódust, amely kiszámítja egy háromszög területét.

export class Triangle {
    base !: number;
    height !: number;
    area !: number;
    constructor(base: number, height: number) {
        this.base = base;
        this.height = height;
    }
    calcArea() {
        this.area = this.base * this.height / 2;
    }
}

src/app/employee.ts

export class Employee {
    name !: string;
    city !: string;
    salary !: number;
    constructor(name: string, city: string, salary: number) {
        this.name = name;
        this.city = city;
        this.salary = salary;
    }
}

src/app/employee.ts

//...
import { Employee } from './employee';
 
//...
export class AppComponent {
  title = 'app01';
 
  employees = [
    new Employee('Fer Irma', 'Szeged', 384),
    new Employee('Tar Irén', 'Szolnok', 382),
    new Employee('Lel Béla', 'Miskolc', 381),
    new Employee('Reg Elek', 'Budapest', 354)
  ]
 
}

src/app/app.component.html

<h1>Dolgozók</h1>
 
<table>
  <thead>
    <tr>
      <th>Név</th>
      <th>Település</th>
      <th>Fizetés</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let employee of employees">
      <td>{{ employee.name }}</td>
      <td>{{ employee.city }}</td>
      <td>{{ employee.salary }}</td>
    </tr>
  </tbody>
</table>