Különbségek

A kiválasztott változat és az aktuális verzió közötti különbségek a következők.

--- oktatas:web:angular:angular_triangle [2021/12/05 22:58] – [Használat] admin
+++ oktatas:web:angular:angular_triangle [2025/03/02 18:01] (aktuális) – eltávolítva admin
@@ Sor 1: / Sor 1: @@
-[[oktatas:web:angular|< Angular]]
-====== Angular Triangle ======
-  * **Szerző:** Sallai András
-  * Copyright (c) Sallai András, 2021
-  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
-  * Web: https://szit.hu
-===== Triangle osztály =====
-<code javascript triangle.ts>
-export class Triangle {
-    base: number;
-    height: number;
-    area: number;
-    constructor() {
-        this.base = 0;
-        this.height = 0;
-        this.area = 0;
-    }
-    calcArea() {
-        this.area = this.base * this.height / 2;
-    }
-}
-</code>
-===== Használat =====
-<code javascript app.component.ts>
-import { Component } from '@angular/core';
-import { Triangle } from './triangle';
-@Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrls: ['./app.component.css']
-})
-export class AppComponent {
-  title = 'triangle';
-  base: string;
-  height: string;
-  area: string;
-  constructor() {
-    this.base = '';
-    this.height = '';
-    this.area = '';
-  }
-  calcArea(): any {
-    let triangle = new Triangle();
-    triangle.base = Number(this.base);
-    triangle.height = Number(this.height);
-    triangle.calcArea();
-    this.area = String(triangle.area);
-  }
-}
-</code>
-Template:
-<code html app.component.html>
-<div class="container">
-  <h1>Háromszög</h1>
-  <h2>Háromszög területe</h2>
-  <label for="base"
-  class="form-label">Alap</label>
-  <input type="text" id="base"
-  class="form-control"
-  [(ngModel)]="base"><br>
-  <label for="height"
-  class="form-label">Magasság</label>
-  <input type="text" id="height"
-  class="form-control"
-  [(ngModel)]="height"><br>
-  <button (click)="calcArea()"
-  class="btn btn-primary mb-3">
-    Számít
-  </button><br>
-  <label class="form-label">Terület</label>
-  <input type="text"
-  class="form-control"
-  disabled
-  [(ngModel)]="area"><br>
-</div>
-<div class="content"><span>{{ title }} app is running!</span></div>
-</code>
-<code javascript app.module.ts>
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { AppComponent } from './app.component';
-import { FormsModule } from '@angular/forms';
-@NgModule({
-  declarations: [
-    AppComponent
-  ],
-  imports: [
-    BrowserModule,
-    FormsModule
-  ],
-  providers: [],
-  bootstrap: [AppComponent]
-})
-export class AppModule { }
-</code>