Skip to content

Commit 531197a

Browse files
committed
fix(*): timepicker and navdrawer sample after merging master
1 parent 4d73610 commit 531197a

File tree

2 files changed

+100
-54
lines changed

2 files changed

+100
-54
lines changed

projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,24 @@ export interface IgxTimePickerValidationFailedEventArgs extends IBaseEventArgs {
9191
display: block;
9292
}`
9393
],
94-
imports: [IgxInputGroupComponent, IgxInputDirective, IgxDateTimeEditorDirective, IgxTextSelectionDirective, IgxPrefixDirective, IgxIconComponent, IgxSuffixDirective, IgxButtonDirective, IgxToggleDirective, NgClass, IgxItemListDirective, IgxTimeItemDirective, NgTemplateOutlet, TimeFormatPipe, TimeItemPipe, IgxDividerDirective]
94+
imports: [
95+
IgxInputGroupComponent,
96+
IgxInputDirective,
97+
IgxDateTimeEditorDirective,
98+
IgxTextSelectionDirective,
99+
IgxPrefixDirective,
100+
IgxIconComponent,
101+
IgxSuffixDirective,
102+
IgxButtonDirective,
103+
IgxToggleDirective,
104+
NgClass,
105+
IgxItemListDirective,
106+
IgxTimeItemDirective,
107+
NgTemplateOutlet,
108+
TimeFormatPipe,
109+
TimeItemPipe,
110+
IgxDividerComponent
111+
]
95112
})
96113
export class IgxTimePickerComponent extends PickerBaseDirective
97114
implements

src/app/app.component.html

Lines changed: 82 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -14,74 +14,103 @@
1414
<span igxDrawerItem [isHeader]="true">Components</span>
1515

1616
@for (item of componentLinks; track item) {
17-
<span #csmp="routerLinkActive" igxDrawerItem igxRipple routerLinkActive [active]="csmp.isActive" routerLink="{{item.link}}">
18-
<igx-icon>{{item.icon}}</igx-icon>
19-
<span class="navdrawer-ellipsis">{{item.name}}</span>
20-
</span>
17+
<span
18+
#csmp="routerLinkActive"
19+
igxDrawerItem
20+
igxRipple
21+
routerLinkActive
22+
[active]="csmp.isActive"
23+
routerLink="{{ item.link }}"
24+
>
25+
<igx-icon>{{ item.icon }}</igx-icon>
26+
<span class="navdrawer-ellipsis">{{ item.name }}</span>
27+
</span>
2128
}
2229

2330
<!--Directives-->
2431
<span igxDrawerItem [isHeader]="true">Directives</span>
2532

2633
@for (item of directiveLinks; track item) {
27-
<span #dsmp="routerLinkActive" igxDrawerItem igxRipple routerLinkActive [active]="dsmp.isActive" routerLink="{{item.link}}">
28-
<igx-icon>{{item.icon}}</igx-icon>
29-
<span class="navdrawer-ellipsis">{{item.name}}</span>
30-
</span>
34+
<span
35+
#dsmp="routerLinkActive"
36+
igxDrawerItem
37+
igxRipple
38+
routerLinkActive
39+
[active]="dsmp.isActive"
40+
routerLink="{{ item.link }}"
41+
>
42+
<igx-icon>{{ item.icon }}</igx-icon>
43+
<span class="navdrawer-ellipsis">{{ item.name }}</span>
44+
</span>
3145
}
32-
46+
3347
<span igxDrawerItem [isHeader]="true">Style</span>
34-
35-
<span
36-
#ssmp="routerLinkActive"
37-
*ngFor="let item of styleLinks"
38-
igxDrawerItem
39-
igxRipple
40-
routerLinkActive
41-
[active]="ssmp.isActive"
42-
routerLink="{{ item.link }}"
43-
>
44-
<igx-icon>{{ item.icon }}</igx-icon>
45-
<span class="navdrawer-ellipsis">{{ item.name }}</span>
46-
</span>
47-
</ng-template>
4848

49-
@for (item of styleLinks; track item) {
50-
<span igxDrawerItem igxRipple routerLinkActive="igx-nav-drawer__item--active" routerLink="{{item.link}}">
51-
<igx-icon>{{item.icon}}</igx-icon>
52-
<span class="navdrawer-ellipsis">{{item.name}}</span>
53-
</span>
54-
}
55-
</ng-template>
49+
@for (item of styleLinks; track item) {
50+
<span
51+
#ssmp="routerLinkActive"
52+
igxDrawerItem
53+
igxRipple
54+
[active]="ssmp.isActive"
55+
routerLinkActive
56+
routerLink="{{ item.link }}"
57+
>
58+
<igx-icon>{{ item.icon }}</igx-icon>
59+
<span class="navdrawer-ellipsis">{{ item.name }}</span>
60+
</span>
61+
}
62+
</ng-template>
5663

57-
@if (drawerState.miniVariant) {
58-
<ng-template igxDrawerMini>
59-
@for (item of componentLinks; track item) {
60-
<span igxRipple igxDrawerItem routerLinkActive #rla="routerLinkActive" [active]="rla.isActive" routerLink="{{item.link}}">
61-
<igx-icon>{{item.icon}}</igx-icon>
62-
</span>
63-
}
64+
@if (drawerState.miniVariant) {
65+
<ng-template igxDrawerMini>
66+
@for (item of componentLinks; track item) {
67+
<span
68+
igxRipple
69+
igxDrawerItem
70+
routerLinkActive
71+
#rla="routerLinkActive"
72+
[active]="rla.isActive"
73+
routerLink="{{ item.link }}"
74+
>
75+
<igx-icon>{{ item.icon }}</igx-icon>
76+
</span>
77+
}
6478

65-
<span igxDrawerItem [disabled]="true">
66-
<igx-icon>web</igx-icon>
67-
</span>
79+
<span igxDrawerItem [disabled]="true">
80+
<igx-icon>web</igx-icon>
81+
</span>
6882

69-
@for (item of directiveLinks; track item) {
70-
<span igxDrawerItem igxRipple routerLinkActive #rla="routerLinkActive" [active]="rla.isActive" routerLink="{{item.link}}">
71-
<igx-icon>{{item.icon}}</igx-icon>
72-
</span>
73-
}
83+
@for (item of directiveLinks; track item) {
84+
<span
85+
igxDrawerItem
86+
igxRipple
87+
routerLinkActive
88+
#rla="routerLinkActive"
89+
[active]="rla.isActive"
90+
routerLink="{{ item.link }}"
91+
>
92+
<igx-icon>{{ item.icon }}</igx-icon>
93+
</span>
94+
}
7495

75-
@for (item of styleLinks; track item) {
76-
<span igxDrawerItem igxRipple routerLinkActive #rla="routerLinkActive" [active]="rla.isActive" routerLink="{{item.link}}">
77-
<igx-icon>{{item.icon}}</igx-icon>
78-
</span>
79-
}
80-
</ng-template>
96+
@for (item of styleLinks; track item) {
97+
<span
98+
igxDrawerItem
99+
igxRipple
100+
routerLinkActive
101+
#rla="routerLinkActive"
102+
[active]="rla.isActive"
103+
routerLink="{{ item.link }}"
104+
>
105+
<igx-icon>{{ item.icon }}</igx-icon>
106+
</span>
81107
}
82-
</igx-nav-drawer>
108+
</ng-template>
109+
}
110+
</igx-nav-drawer>
83111

84-
@let config = (propertyChangeService.panelConfig | async | keyvalue)?.length > 0;
112+
@let config =
113+
(propertyChangeService.panelConfig | async | keyvalue)?.length > 0;
85114

86115
@if (config) {
87116
<igx-nav-drawer

0 commit comments

Comments
 (0)