Bocs, előbb írtam, mint, hogy olvastam volna :D
Még mindig van egy “hogyan érdemes” kérdésem.
Szóval adott három osztály, ebből csak az egyik érdekes most:
export class Page {
id: number;
title: string;
conditions: Condition[];
content: Content;
}
Amire nekem szükségem lenne, az egy Singleton, ami a pages array-t kezelné. Mert lenne benne hozzáadás, szerkesztés, eltávolítás, stb…
De nem akarom elhasználni rá a pages.service.ts-t, mert ezt majd az adatbázis kapcsolatra szeretném felhasználni. Az app.components.ts-be sem szeretném tenni, hiszen sok funkciót kaphat. Most ugyan létrehoztam egy main.service.ts-t, ami jelenleg megvalósítja ezt, de a gondom az, hogy lehet majd a Condition és a Content osztályoknak is kell majd egy-egy külön fájl, ahol szintén meglesznek a funkciói. Néztem a példakódot, ahol a heroes.component.ts fájlban valósítja meg a herok szerkesztését. De én nem biztos, hogy akarok az összes oldalnak egy ilyen komponenst.
Hogyan lehetne ezt kivitelezni, hogy létrejöjjön a helyes Style Guide szerinti megvalósítás?
Ami a component-hez tartozik, az oda tartozik és kész. Ha több komponens csinálja ugyanazt, akkor azt a funkcionalitást ki kell refaktorálni egy service-be, és a service-t beinjektálni a komponensekbe.
Én a CRUD funkcionalitást beletettem egy entityService-be, mert mindent kell menteni meg updatelni meg törölni. A service be van injektálva a componentekbe, és mindannyian azt használják a saját adataikkal.
Szerk: igazából van egy abstract BaseComponent classom, amibe az entityService bele van injektálva, és abban vannak a create/update stb.functionok. Ezt extendeli a többi component.
Abstract class-t, hogy lehet létrehozni?
Vagy egyáltalán nem kell megjelölni abastractként csak tudod, hogy az az?
Vagy hogyan lehet megírni azt, hogy ha subclass van, akkor kötelező legyen felülírni egy-egy funkciót/property-t?
import { MyService } from './path/to/service';
export abstract class ParentClass {
protected myParam: any;
//constructor param has to be public or protected,
//to be accessible by the children
constructor(public myService: MyService){
}
///////////////////
//this has to be implemented in every child
protected abstract implementThis(): void;
//every child has this function
protected doSomething(){
this.myService.doSomething();
}
}
Es igy extendeled:
import { ParentClass } from './path';
import { MyService } from './path';
import { OtherService } from './path';
export class ChildClass extends ParentClass {
//every constructor param, the parent has, has to be passed
// in the child's constructor function, in a super() call.
constructor(public myService: MyService,
private otherService: OtherService ) {
super(myService);
}
protected implementThis(){
//implementation
}
}
En meg ennyi hibat nem vetettem egy ilyen rovid kodban :D De most elvileg jo.
Igazából a kódot úgy sem illesztettem volna be, hanem csak az elmélet érdekelt! Köszönöm!!!
Következő izzasztó kérdés :D
Swift-ben van protocol. Ez szintén olyasmi, mint egy abstract class (swiftben nincs is abstract). Szóval ott ha egy class ki van terjesztve abstractként, akkor kötelező minden property-t és functiont létrehozni. És egy másik osztályban meg lehet adni egy property-t (delegate), ami támogatha ezt a protocolt (abstract). Ez itt így működik?
Erre gondolok:
export abstract class SomeProtocol {
protected abstract myParam: any;
protected abstract implementThis(): void;
}
export class Valami extends SomeProtocol { ... }
export class MasValami implements OnInit {
public delegate: SomeProtocol
ngOnInit() {
this.delegate = new Valami();
this.delegate.implementThis();
}
}
Jó, persze nem az ngOnInit-ben létrehozva meg nem így használva, csak hogy lásd az elméletet.
A gondom az, hogy van egy comonens osztály, ahol van két injektált service. Az egyik service-nek visszafelé is kellene kommunikálnia (mert például egy egérkattintás esemény ott keletkezik). Hozzáteszem azt is, hogy a componensnek nincs értelme a service nélkül és fordítva is igaz. Vagy emiatt oldjam meg az egészet a componensben? Lehet sokkal egyszerűbb lenne… csak szét akartam választani a componens működését a cytoscape rajzolástól…
Jó mondjuk valószínűleg a cytoscape rajzolást most fixen beleteszem a componensbe, hiszen úgy is együtt van értelme… De az elmélet akkor is érdekel :D
A peldadban a Valami egy egy injectable service, a MasValami constructoraba kellene injectalni.
A user eventet a componentek kezelik, hiszen hozzajuk tartozik a view.
@Component({selector, template blabla})
export class MyComponent(){
constructor(valami: ValamiService ){}
//you can pass the function whatever you want, of course
public handleClick(event: any) {
this.valami.implementThis(event.target.value);
}
}
my.component.html:
<input type="text" (keyup)="handleClick($event)">
Ja igen, nem írtam le egyértelműen. Pont, hogy a MasValami lenne a service és azt szeretném injektálni a Valami-be. Tehát hogy meglegyen a kommunikáció a Valami és MasValami között és visszafelé is. Ugyanis alap esetben a componens (Valami) hívogatná a service kódjait, de van olyan, amikor a MasValami (service) keletkezik egy esemény, amiről meg értesíteni kell a componenst (Valami). Bár azt hiszem, hogy ezt Observable segítségével oldják meg.
Egyébként igazad van, mert végül már beraktam a cytocape-et a componensbe (mert ugyebár rájöttem, hogy nincs értelme külön rakni).
Szóval még tanulnom kell sokat, hogy mit hogyan lehet és kell megoldani.
Amúgy köszi a kitartó segítséget! :)
En a komponensek kozotti kommunikaciot Observer patternnel oldom meg. Nem egeszen igy, de itt pl van egy tok jo pelda kiindulaskepp:
Köszönöm! Szerintem ez lesz amit kerestem! :)
Amúgy lassan már csak egy dolog hiányzik, hogy az egészet Te írd meg :D
:D
Na, már megint elakadtam… hihetetlen :D
A gond az, hogy a cytoscapenek van egy funckiója, amikor kiválasztok egy elemet, akkor visszajelez a kiválasztott elemmel:
this.cy.on('tap', function(event) { ... } );
És ezen belül ha meghívok egy typescript functiót, akkor kiírja, hogy:
TypeError: this.xxxfunction is not a function.
Közben persze keresem a megoldást…
Erre mit mond?
this.cy.on('tap', () => {...ts function here})
Köszönöm! Nem is olyan egyszerű ez a typescript :)
Legalább most már tudom, hogy mi ez a szintaktika: () => { }
Mert a példakódban volt használatban, de nem magyarázták el!
Fat arrow function, nem veszted el vele a scope-ot.
https://basarat.gitbooks.io/typescript/docs/arrow-functions.html
Akkor megy?
Bocs, most vettem észre, hogy erre nem válaszoltam. Amúgy igen, akkor ment, most megint volt vele egy kis gond, de már megint megy
Nem értem. Múltkor megcsináltam, hogy proxyn keresztül működjön az authentikáció (mármint egyelőre php-ban írom MAMP segítségével) és most meg egyáltalán nem akar működni.
Ez az utolsó proxy config fájlom ami működött:
"/api": {
"target": "http://localhost:8888",
"secure": false,
"logLevel": "debug",
"changeOrigin": "true",
"pathRewrite": { "^/api": "" }
}
Bár azt szeretném, hogy ha a http://localhost:8888/backend lenne az elérési út, nem közvetlen a port. Hogy kell ezt megcsinálni, hogy jó legyen?