Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 5bc8b73

Browse files
hoebbelsBhoebbelsB
authored
Merge branch 'main' into scheduler-coalesce-ngzone
2 parents 2a2a43b + 4cc9a73 commit 5bc8b73

File tree

20 files changed

+178
-104
lines changed

20 files changed

+178
-104
lines changed

‎apps/demos/src/app/app-shell/app-shell.module.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,16 @@ import { MatSelectModule } from '@angular/material/select';
88
import { MatSidenavModule } from '@angular/material/sidenav';
99
import { MatToolbarModule } from '@angular/material/toolbar';
1010
import { RouterModule } from '@angular/router';
11-
import { AppShellHeaderContent, AppShellSidenavContent, AppShellSidenavTitle } from './app-shell-content.directives';
11+
import {
12+
AppShellHeaderContent,
13+
AppShellSidenavContent,
14+
AppShellSidenavTitle,
15+
} from './app-shell-content.directives';
1216
import { AppShellComponent } from './app-shell-component/app-shell.component';
1317
import { AppShellSideNavItemDirective } from './side-nav/side-nav-item.directive';
1418
import { AppShellSideNavComponent } from './side-nav/side-nav.component';
1519
import { RxLetModule } from '../rx-angular-pocs/template/directives/let';
16-
import { RxIfModule } from '../rx-angular-pocs/template/directives/if';
20+
import { IfModule } from '@rx-angular/template/experimental/if';
1721

1822
const exportedDeclarations = [
1923
AppShellHeaderContent,
@@ -36,7 +40,7 @@ const exportedDeclarations = [
3640
MatSelectModule,
3741
CdkTreeModule,
3842
RxLetModule,
39-
RxIfModule,
43+
IfModule,
4044
],
4145
exports: exportedDeclarations,
4246
})

‎apps/demos/src/app/features/experiments/structural-directives/if-visible-poc/if-visible.module.ts

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,15 @@ import { NgModule } from '@angular/core';
22
import { VisualizerModule } from '../../../../shared/debug-helper/visualizer';
33
import { ValueProvidersModule } from '../../../../shared/debug-helper/value-provider';
44
import { IfVisibleComponent } from './if-visible.component';
5-
import { RxLetModule, RxIfModule } from '../../../../rx-angular-pocs';
5+
import { RxLetModule } from '../../../../rx-angular-pocs';
6+
import { IfModule } from '@rx-angular/template/experimental/if';
67

7-
const DECLARATIONS = [
8-
IfVisibleComponent,
9-
];
8+
const DECLARATIONS = [IfVisibleComponent];
109

1110
@NgModule({
1211
declarations: DECLARATIONS,
13-
imports: [
14-
VisualizerModule,
15-
ValueProvidersModule,
16-
RxLetModule,
17-
RxIfModule
18-
],
12+
imports: [VisualizerModule, ValueProvidersModule, RxLetModule, IfModule],
1913
exports: DECLARATIONS,
20-
providers: []
14+
providers: [],
2115
})
22-
export class IfVisibleModule {
23-
}
16+
export class IfVisibleModule {}

‎apps/demos/src/app/features/experiments/structural-directives/rx-switch-poc/rx-switch-poc.module.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@ import { MatFormFieldModule } from '@angular/material/form-field';
1313
import { MatSliderModule } from '@angular/material/slider';
1414
import { MatButtonToggleModule } from '@angular/material/button-toggle';
1515
import { MatInputModule } from '@angular/material/input';
16-
import { RxIfModule, RxSwichModule } from '../../../../rx-angular-pocs/';
16+
import { RxSwichModule } from '../../../../rx-angular-pocs/';
17+
import { IfModule } from '@rx-angular/template/experimental/if';
1718
import { ValueProvidersModule } from '../../../../shared/debug-helper/value-provider';
1819

1920
@NgModule({
@@ -31,7 +32,7 @@ import { ValueProvidersModule } from '../../../../shared/debug-helper/value-prov
3132
MatSliderModule,
3233
MatButtonToggleModule,
3334
MatInputModule,
34-
RxIfModule,
35+
IfModule,
3536
RxSwichModule,
3637
ValueProvidersModule,
3738
],

‎apps/demos/src/app/features/template/rx-for/list-actions/list-actions.module.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import { VisualizerModule } from '../../../../shared/debug-helper/visualizer/vis
1616
import { RecursiveModule } from '../../../../shared/template-structures/recursive/recursive.module';
1717
import { ListActionsComponent } from './list-actions.component';
1818
import { ROUTES } from './list-actions.routes';
19-
import { RxIfModule } from '../../../../rx-angular-pocs';
19+
import { IfModule } from '@rx-angular/template/experimental/if';
2020
import { StrategySelectModule } from '../../../../shared/debug-helper/strategy-select';
2121

2222
const DECLARATIONS = [ListActionsComponent];
@@ -41,7 +41,7 @@ const DECLARATIONS = [ListActionsComponent];
4141
StrategySelectModule,
4242
LetModule,
4343
ForModule,
44-
RxIfModule,
44+
IfModule,
4545
],
4646
exports: [DECLARATIONS],
4747
})

‎apps/demos/src/app/features/template/rx-if/rx-if-basic.component.ts

Lines changed: 50 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import { Component } from '@angular/core';
2-
import { Subject } from 'rxjs';
1+
import { ChangeDetectionStrategy, Component } from '@angular/core';
2+
import { BehaviorSubject, Subject } from 'rxjs';
33
import { map } from 'rxjs/operators';
4-
import { environment } from '../../../../environments/environment';
54

65
@Component({
76
selector: 'rxa-rx-if-poc',
@@ -10,54 +9,89 @@ import { environment } from '../../../../environments/environment';
109
<div visualizerHeader>
1110
<h2>rxIf POC</h2>
1211
<rxa-strategy-select
13-
(strategyChange)="strategy = $event"
12+
(strategyChange)="strategy$.next($event)"
1413
></rxa-strategy-select>
1514
<rxa-value-provider
1615
#v="rxaValueProvider"
1716
[buttons]="true"
1817
></rxa-value-provider>
19-
<button mat-raised-button (click)="v.next()" class="mr-1">
18+
<button
19+
mat-raised-button
20+
(click)="staticBool = !staticBool; v.next()"
21+
class="mr-1"
22+
>
2023
toggle
2124
</button>
22-
<button mat-raised-button [unpatch] (click)="v.next()">
25+
<button
26+
mat-raised-button
27+
[unpatch]
28+
(click)="staticBool = !staticBool; v.next()"
29+
>
2330
toggle (unpatched)
2431
</button>
2532
</div>
2633
<div class="row w-100">
2734
<div class="col-sm-3">
28-
<h3>RxIf</h3>
35+
<h3>RxIf (observable value)</h3>
2936
<strong *rxLet="rendered$; let rendered"
3037
>Rendercallback: {{ rendered }}</strong
3138
>
32-
<ng-template #elseTpl>
33-
<div class="dh-embedded-view">
34-
<rxa-dirty-check></rxa-dirty-check>
35-
FALSE TEMPLATE
36-
</div>
37-
</ng-template>
3839
<div
3940
class="dh-embedded-view"
4041
*rxIf="
4142
v.boolean$;
4243
let value;
4344
renderCallback: renderCallback;
44-
strategy: strategy
45+
strategy: strategy$;
46+
else: elseTpl;
47+
suspenseTpl: suspenseTpl;
48+
completeTpl: completeTpl;
49+
errorTpl: errorTpl
4550
"
4651
>
4752
<rxa-dirty-check></rxa-dirty-check>
4853
TRUE TEMPLATE
4954
</div>
5055
</div>
56+
<div class="col-sm-3">
57+
<h3>RxIf (static value)</h3>
58+
<strong *rxLet="rendered$; let rendered"
59+
>Rendercallback: {{ rendered }}</strong
60+
>
61+
<div
62+
class="dh-embedded-view"
63+
*rxIf="
64+
staticBool;
65+
renderCallback: renderCallback;
66+
strategy: strategy$;
67+
else: elseTpl
68+
"
69+
>
70+
<rxa-dirty-check></rxa-dirty-check>
71+
TRUE TEMPLATE
72+
</div>
73+
</div>
74+
<ng-template #elseTpl>
75+
<div class="dh-embedded-view">
76+
<rxa-dirty-check></rxa-dirty-check>
77+
FALSE TEMPLATE
78+
</div>
79+
</ng-template>
80+
<ng-template #errorTpl> ERROR </ng-template>
81+
<ng-template #completeTpl> COMPLETE </ng-template>
82+
<ng-template #suspenseTpl> SUSPENSE </ng-template>
5183
</div>
5284
</rxa-visualizer>
5385
`,
54-
changeDetection: environment.changeDetection,
86+
changeDetection: ChangeDetectionStrategy.OnPush,
5587
})
5688
export class RxIfBasicComponent {
5789
private _renderCalled = 0;
5890
readonly renderCallback = new Subject();
5991

6092
rendered$ = this.renderCallback.pipe(map(() => this._renderCalled++));
6193

62-
strategy;
94+
strategy$ = new BehaviorSubject('normal');
95+
96+
staticBool = true;
6397
}

‎apps/demos/src/app/features/template/rx-if/rx-if-demo.module.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { CommonModule } from '@angular/common';
33
import { MatButtonModule } from '@angular/material/button';
44

55
import { RouterModule } from '@angular/router';
6+
import { IfModule } from '@rx-angular/template/experimental/if';
67
import { ROUTES } from './rx-if.routes';
78
import { RxIfBasicComponent } from './rx-if-basic.component';
89
import { VisualizerModule } from '../../../shared/debug-helper/visualizer';
@@ -12,7 +13,6 @@ import { StrategySelectModule } from '../../../shared/debug-helper/strategy-sele
1213
import { ValueProvidersModule } from '../../../shared/debug-helper/value-provider';
1314
import { GhostElementsModule } from '../../../shared/ghost-elements';
1415
import { DirtyChecksModule } from '../../../shared/debug-helper/dirty-checks';
15-
import { RxIfModule } from '../../../rx-angular-pocs';
1616

1717
const DECLARATIONS = [RxIfBasicComponent];
1818

@@ -29,7 +29,7 @@ const DECLARATIONS = [RxIfBasicComponent];
2929
ValueProvidersModule,
3030
StrategySelectModule,
3131
RouterModule.forChild(ROUTES),
32-
RxIfModule
32+
IfModule,
3333
],
3434
exports: DECLARATIONS,
3535
})

‎apps/demos/src/app/features/template/strategies/comparison/comparison.module.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ import { VisualizerModule } from '../../../../shared/debug-helper/visualizer';
1515
import { SiblingModule } from '../../../../shared/template-structures/sibling/sibling.module';
1616
import { ImageArrayModule } from '../../../../shared/image-array/image-array.module';
1717
import { ROUTES } from './comparison.routes';
18-
import { RxForModule, RxIfModule, PipeModule } from '../../../../rx-angular-pocs';
19-
18+
import { RxForModule, PipeModule } from '../../../../rx-angular-pocs';
19+
import { IfModule } from '@rx-angular/template/experimental/if';
2020

2121
@NgModule({
2222
declarations: [ComparisonComponent],
@@ -35,7 +35,7 @@ import { RxForModule, RxIfModule, PipeModule } from '../../../../rx-angular-pocs
3535
ImageArrayModule,
3636
LetModule,
3737
RxForModule,
38-
RxIfModule,
38+
IfModule,
3939
PipeModule,
4040
],
4141
exports: [],

‎apps/demos/src/app/rx-angular-pocs/template/directives/if/index.ts

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎apps/demos/src/app/rx-angular-pocs/template/directives/index.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
11
export * from './let';
2-
export * from './if';
32
export * from './switch';
43
export * from './for';
54
export * from './unpatch';
65
export * from './if-visible';
7-
8-

‎libs/cdk/template/src/lib/template-manager.ts

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,17 @@ import {
1111
import { EMPTY, merge, Observable, of } from 'rxjs';
1212
import {
1313
catchError,
14+
filter,
1415
ignoreElements,
16+
map,
1517
switchMap,
1618
withLatestFrom,
1719
} from 'rxjs/operators';
18-
import { RxRenderWork, onStrategy, strategyHandling } from '@rx-angular/cdk/render-strategies';
20+
import {
21+
RxRenderWork,
22+
onStrategy,
23+
strategyHandling,
24+
} from '@rx-angular/cdk/render-strategies';
1925
import {
2026
rxBaseTemplateNames,
2127
RxRenderAware,
@@ -150,25 +156,28 @@ export function createTemplateManager<
150156
render(values$: Observable<RxNotification<T>>): Observable<any> {
151157
return values$.pipe(
152158
// mergeWith(triggerHandling.trigger$ || EMPTY),
153-
withLatestFrom(strategyHandling$.strategy$),
154-
// Cancel old renders
155-
switchMap(([notification, strategy]) => {
159+
map((notification) => {
156160
const kind: RxNotificationKind = notification.kind;
157161
const value: T = notification.value as T;
158162
const templateName = notificationToTemplateName[kind](
159163
value,
160164
templates
161165
);
162-
163166
const template = templates.get(templateName);
167+
return { template, templateName, notification };
168+
}),
169+
filter(({ template }) => !!template),
170+
withLatestFrom(strategyHandling$.strategy$),
171+
// Cancel old renders
172+
switchMap(([{ template, templateName, notification }, strategy]) => {
164173
const isNewTemplate = activeTemplate !== templateName;
165174
const notifyParent = isNewTemplate && parent;
166175
return merge(
167176
onStrategy(
168-
value,
177+
notification.value,
169178
strategy,
170179
(v: T, work: RxRenderWork, options: RxCoalescingOptions) => {
171-
const context = <C>getContext[kind](notification);
180+
const context = <C>getContext[notification.kind](notification);
172181
if (isNewTemplate) {
173182
// template has changed (undefined => next; suspense => next; ...)
174183
// handle remove & insert

‎libs/cdk/zone-less/src/index.ts

Lines changed: 0 additions & 19 deletions
This file was deleted.

‎libs/cdk/zone-less/src/test-setup.ts

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎libs/template/experimental/if/ng-package.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"$schema": "../../../../node_modules/ng-packagr/package.schema.json",
3+
"lib": {
4+
"entryFile": "src/index.ts",
5+
"flatModuleFile": "template-experimental-if"
6+
}
7+
}

‎libs/template/experimental/if/src/index.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export {
2+
RxIfViewContext,
3+
rxIfTemplateNames,
4+
RxIfTemplateNames,
5+
} from './lib/model';
6+
export { RxIf } from './lib/if.directive';
7+
export { IfModule } from './lib/if.module';

0 commit comments

Comments
 (0)