|
1 | | -import{Component,ElementRef,inject,Input,OnInit,Renderer2}from'@angular/core'; |
| 1 | +import{Component,effect,ElementRef,inject,input,Renderer2}from'@angular/core'; |
| 2 | +import{INavData}from'./sidebar-nav'; |
2 | 3 |
|
3 | 4 | @Component({ |
4 | 5 | selector:'c-sidebar-nav-title', |
5 | 6 | template:'' |
6 | 7 | }) |
7 | | -exportclassSidebarNavTitleComponentimplementsOnInit{ |
| 8 | +exportclassSidebarNavTitleComponent{ |
8 | 9 | readonly #elementRef=inject(ElementRef); |
9 | 10 | readonly #renderer=inject(Renderer2); |
10 | 11 |
|
11 | | -@Input()item:any; |
| 12 | +readonlyitem=input<INavData>(); |
12 | 13 |
|
13 | | -ngOnInit():void{ |
14 | | -constnativeElement:HTMLElement=this.#elementRef.nativeElement; |
15 | | -constname=this.#renderer.createText(this.item.name); |
| 14 | +readonly #itemEffect=effect(()=>{ |
| 15 | +constitem=this.item(); |
| 16 | +if(item?.name){ |
| 17 | +constnativeElement:HTMLElement=this.#elementRef.nativeElement; |
| 18 | +constname=this.#renderer.createText(item.name); |
16 | 19 |
|
17 | | -if(this.item.class){ |
18 | | -constclasses=this.item.class; |
19 | | -this.#renderer.addClass(nativeElement,classes); |
20 | | -} |
| 20 | +if(item?.class){ |
| 21 | +constclasses=item.class; |
| 22 | +this.#renderer.addClass(nativeElement,classes); |
| 23 | +} |
21 | 24 |
|
22 | | -if(this.item.wrapper){ |
23 | | -constwrapper=this.#renderer.createElement(this.item.wrapper.element); |
24 | | -this.addAttribs(this.item.wrapper.attributes,wrapper); |
25 | | -this.#renderer.appendChild(wrapper,name); |
26 | | -this.#renderer.appendChild(nativeElement,wrapper); |
27 | | -}else{ |
28 | | -this.#renderer.appendChild(nativeElement,name); |
| 25 | +if(item?.wrapper){ |
| 26 | +constwrapper=this.#renderer.createElement(item.wrapper.element); |
| 27 | +this.addAttribs(item.wrapper.attributes,wrapper); |
| 28 | +this.#renderer.appendChild(wrapper,name); |
| 29 | +this.#renderer.appendChild(nativeElement,wrapper); |
| 30 | +}else{ |
| 31 | +this.#renderer.appendChild(nativeElement,name); |
| 32 | +} |
29 | 33 | } |
30 | | -} |
| 34 | +}); |
31 | 35 |
|
32 | | -privateaddAttribs(attribs:{[x:string]:any},element:any):void{ |
| 36 | +privateaddAttribs(attribs:{[x:string]:any},element:HTMLElement):void{ |
33 | 37 | if(attribs){ |
34 | 38 | for(constattrinattribs){ |
35 | 39 | if(attr==='style'&&typeofattribs[attr]==='object'){ |
|