Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 685ddca

Browse files
authored
Merge branch 'master' into sis0k0/remove-short-imports-resolution
2 parents e1b6e20 + 9dfc569 commit 685ddca

File tree

4 files changed

+56
-51
lines changed

4 files changed

+56
-51
lines changed

‎e2e/modal-navigation-ng/app/navigation/basic.navigation.component.ts

Lines changed: 26 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Component, ViewContainerRef, Input } from "@angular/core";
1+
import { Component, ViewContainerRef, Input,ViewChild,ElementRef } from "@angular/core";
22
import { Router, NavigationEnd } from "@angular/router";
33
import { ModalDialogService, ModalDialogOptions } from "nativescript-angular/directives/dialogs";
44
import { ModalComponent } from "../modal/modal.component";
@@ -17,19 +17,21 @@ import { ModalViewComponent } from "~/modal-shared/modal-view.component";
1717
<Button text="Show Modal Page With Frame" (tap)="onModalFrame()" textAlignment="left"></Button>
1818
<Button text="Show Shared Modal" (tap)="onRootModalTap()" textAlignment="left"></Button>
1919
<Button text="Show Dialog" (tap)="onShowDialog()" textAlignment="left"></Button>
20+
<Button #popoverButtonComp text="Show 'popover' modal" (tap)="onPopoverModal()" textAlignment="left"></Button>
2021
</StackLayout>`
2122
})
2223

2324
export class BasicsNavigationComponent {
2425

26+
@ViewChild("popoverButtonComp") popoverButtonComp: ElementRef;
2527
@Input() col: number;
2628
constructor(
2729
private modal: ModalDialogService,
2830
private router: Router,
2931
private vcf: ViewContainerRef,
3032
private viewContainerRefService: ViewContainerRefService) {
3133
}
32-
34+
3335
onModalNoFrame() {
3436
const options: ModalDialogOptions = {
3537
context: {
@@ -74,14 +76,28 @@ export class BasicsNavigationComponent {
7476

7577
onRootModalTap(): void {
7678
const options: ModalDialogOptions = {
77-
viewContainerRef: this.viewContainerRefService.root,
78-
context: {},
79-
fullscreen: true
79+
viewContainerRef: this.viewContainerRefService.root,
80+
context: {},
81+
fullscreen: true
8082
};
81-
83+
8284
this.modal.showModal(ModalViewComponent, options)
83-
.then((result: string) => {
84-
console.log(result);
85-
});
86-
}
85+
.then((result: string) => {
86+
console.log(result);
87+
});
88+
}
89+
90+
onPopoverModal() {
91+
const options: ModalDialogOptions = {
92+
viewContainerRef: this.viewContainerRefService.root,
93+
context: {},
94+
ios: {
95+
presentationStyle: UIModalPresentationStyle.Popover
96+
},
97+
target: this.popoverButtonComp.nativeElement
98+
};
99+
100+
this.modal.showModal(ModalViewComponent, options)
101+
.then((result: string) => { console.log(result);});
102+
}
87103
}

‎e2e/modal-navigation-ng/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
"nativescript-dev-appium": "next",
4747
"nativescript-dev-typescript": "next",
4848
"nativescript-dev-webpack": "next",
49+
"tns-platform-declarations": "next",
4950
"typescript": "~3.1.1"
5051
},
5152
"scripts": {

‎e2e/modal-navigation-ng/references.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference path="./node_modules/tns-platform-declarations/ios.d.ts" />

‎nativescript-angular/directives/dialogs.ts

Lines changed: 28 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import {
66
NgModuleRef,
77
ReflectiveInjector,
88
Type,
9-
ViewContainerRef,
9+
ViewContainerRef
1010
} from "@angular/core";
1111

1212
import { NSLocationStrategy } from "../router/ns-location-strategy";
@@ -18,14 +18,15 @@ import { DetachedLoader } from "../common/detached-loader";
1818
import { PageFactory, PAGE_FACTORY } from "../platform-providers";
1919
import { once } from "../common/utils";
2020
import { topmost, Frame } from "tns-core-modules/ui/frame";
21+
import { ShowModalOptions } from "tns-core-modules/ui/core/view";
2122

22-
export interface ModalDialogOptions {
23+
export type BaseShowModalOptions = Pick<ShowModalOptions, Exclude<keyof ShowModalOptions, "closeCallback" | "context">>;
24+
25+
export interface ModalDialogOptions extends BaseShowModalOptions {
2326
context?: any;
24-
fullscreen?: boolean;
25-
animated?: boolean;
26-
stretched?: boolean;
2727
viewContainerRef?: ViewContainerRef;
2828
moduleRef?: NgModuleRef<any>;
29+
target?: View;
2930
}
3031

3132
export class ModalDialogParams {
@@ -35,13 +36,10 @@ export class ModalDialogParams {
3536
}
3637
}
3738

38-
interface ShowDialogOptions {
39+
interface ShowDialogOptions extendsBaseShowModalOptions{
3940
containerRef: ViewContainerRef;
4041
context: any;
4142
doneCallback;
42-
fullscreen: boolean;
43-
animated: boolean;
44-
stretched: boolean;
4543
pageFactory: PageFactory;
4644
parentView: ViewBase;
4745
resolver: ComponentFactoryResolver;
@@ -54,16 +52,20 @@ export class ModalDialogService {
5452
}
5553

5654
public showModal(type: Type<any>,
57-
{ viewContainerRef, moduleRef, context, fullscreen, animated, stretched }: ModalDialogOptions
55+
options: ModalDialogOptions
5856
): Promise<any> {
59-
if (!viewContainerRef) {
57+
if (!options.viewContainerRef) {
6058
throw new Error(
6159
"No viewContainerRef: " +
6260
"Make sure you pass viewContainerRef in ModalDialogOptions."
6361
);
6462
}
6563

66-
let parentView = viewContainerRef.element.nativeElement;
64+
let parentView = options.viewContainerRef.element.nativeElement;
65+
if (options.target) {
66+
parentView = options.target;
67+
}
68+
6769
if (parentView instanceof AppHostView && parentView.ngAppRoot) {
6870
parentView = parentView.ngAppRoot;
6971
}
@@ -75,11 +77,11 @@ export class ModalDialogService {
7577
parentView = parentView._ngDialogRoot;
7678
}
7779

78-
const pageFactory: PageFactory = viewContainerRef.injector.get(PAGE_FACTORY);
80+
const pageFactory: PageFactory = options.viewContainerRef.injector.get(PAGE_FACTORY);
7981

8082
// resolve from particular module (moduleRef)
8183
// or from same module as parentView (viewContainerRef)
82-
const componentContainer = moduleRef || viewContainerRef;
84+
const componentContainer = options.moduleRef || options.viewContainerRef;
8385
const resolver = componentContainer.injector.get(ComponentFactoryResolver);
8486

8587
let frame = parentView;
@@ -93,16 +95,14 @@ export class ModalDialogService {
9395
setTimeout(() => {
9496
try {
9597
this._showDialog({
96-
containerRef: viewContainerRef,
97-
context,
98+
...options,
99+
containerRef: options.viewContainerRef,
100+
context: options.context,
98101
doneCallback: resolve,
99-
fullscreen,
100-
animated,
101-
stretched,
102102
pageFactory,
103103
parentView,
104104
resolver,
105-
type,
105+
type
106106
});
107107
} catch (err) {
108108
reject(err);
@@ -111,23 +111,12 @@ export class ModalDialogService {
111111
});
112112
}
113113

114-
private _showDialog({
115-
containerRef,
116-
context,
117-
doneCallback,
118-
fullscreen,
119-
animated,
120-
stretched,
121-
pageFactory,
122-
parentView,
123-
resolver,
124-
type,
125-
}: ShowDialogOptions): void {
114+
private _showDialog(options: ShowDialogOptions): void {
126115
let componentView: View;
127116
let detachedLoaderRef: ComponentRef<DetachedLoader>;
128117

129118
const closeCallback = once((...args) => {
130-
doneCallback.apply(undefined, args);
119+
options.doneCallback.apply(undefined, args);
131120
if (componentView) {
132121
componentView.closeModal();
133122
this.location._closeModalNavigation();
@@ -136,15 +125,15 @@ export class ModalDialogService {
136125
}
137126
});
138127

139-
const modalParams = new ModalDialogParams(context, closeCallback);
128+
const modalParams = new ModalDialogParams(options.context, closeCallback);
140129
const providers = ReflectiveInjector.resolve([
141130
{ provide: ModalDialogParams, useValue: modalParams },
142131
]);
143132

144-
const childInjector = ReflectiveInjector.fromResolvedProviders(providers, containerRef.parentInjector);
145-
const detachedFactory = resolver.resolveComponentFactory(DetachedLoader);
146-
detachedLoaderRef = containerRef.createComponent(detachedFactory, -1, childInjector, null);
147-
detachedLoaderRef.instance.loadComponent(type).then((compRef) => {
133+
const childInjector = ReflectiveInjector.fromResolvedProviders(providers, options.containerRef.parentInjector);
134+
const detachedFactory = options.resolver.resolveComponentFactory(DetachedLoader);
135+
detachedLoaderRef = options.containerRef.createComponent(detachedFactory, -1, childInjector, null);
136+
detachedLoaderRef.instance.loadComponent(options.type).then((compRef) => {
148137
const detachedProxy = <ProxyViewContainer>compRef.location.nativeElement;
149138

150139
if (detachedProxy.getChildrenCount() > 1) {
@@ -157,9 +146,7 @@ export class ModalDialogService {
157146
(<any>componentView.parent).removeChild(componentView);
158147
}
159148

160-
// TODO: remove <any> cast after https://github.com/NativeScript/NativeScript/pull/5734
161-
// is in a published version of tns-core-modules.
162-
(<any>parentView).showModal(componentView, context, closeCallback, fullscreen, animated, stretched);
149+
options.parentView.showModal(componentView, { ...options, closeCallback });
163150
});
164151
}
165152
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /