diff --git a/nativescript-angular/directives/dialogs.ts b/nativescript-angular/directives/dialogs.ts index 493768b73..d29cc1f55 100644 --- a/nativescript-angular/directives/dialogs.ts +++ b/nativescript-angular/directives/dialogs.ts @@ -22,20 +22,13 @@ export class ModalDialogParams { @Injectable() export class ModalDialogService { - private containerRef: ViewContainerRef; - - public registerViewContainerRef(ref: ViewContainerRef) { - this.containerRef = ref; - } - public showModal(type: Type, options: ModalDialogOptions): Promise { - let viewContainerRef = options.viewContainerRef || this.containerRef; - - if (!viewContainerRef) { + if (!options.viewContainerRef) { throw new Error( "No viewContainerRef: Make sure you pass viewContainerRef in ModalDialogOptions."); } + const viewContainerRef = options.viewContainerRef; const parentPage: Page = viewContainerRef.injector.get(Page); const resolver: ComponentFactoryResolver = viewContainerRef.injector.get( ComponentFactoryResolver); @@ -101,10 +94,8 @@ export class ModalDialogService { selector: "[modal-dialog-host]" }) export class ModalDialogHost { - constructor(containerRef: ViewContainerRef, modalService: ModalDialogService) { - console.log("ModalDialogHost is deprecated. Call ModalDialogService.showModal() " + + constructor() { + throw new Error("ModalDialogHost is deprecated. Call ModalDialogService.showModal() " + "by passing ViewContainerRef in the options instead."); - - modalService.registerViewContainerRef(containerRef); } } diff --git a/nativescript-angular/nativescript.module.ts b/nativescript-angular/nativescript.module.ts index a1fa97fac..dc0790865 100644 --- a/nativescript-angular/nativescript.module.ts +++ b/nativescript-angular/nativescript.module.ts @@ -21,9 +21,6 @@ import { } from "./platform-providers"; import { NS_DIRECTIVES } from "./directives"; -import * as nativescriptIntl from "nativescript-intl"; -global.Intl = nativescriptIntl; - export function errorHandlerFactory() { return new ErrorHandler(true); }; diff --git a/nativescript-angular/platform-common.ts b/nativescript-angular/platform-common.ts index f2f9301f2..168a4946c 100644 --- a/nativescript-angular/platform-common.ts +++ b/nativescript-angular/platform-common.ts @@ -33,8 +33,7 @@ import { topmost, NavigationEntry } from "ui/frame"; import { Page } from "ui/page"; import { TextView } from "ui/text-view"; -import * as nativescriptIntl from "nativescript-intl"; -global.Intl = nativescriptIntl; +import "nativescript-intl"; export const onBeforeLivesync = new EventEmitter>(); export const onAfterLivesync = new EventEmitter>(); diff --git a/nativescript-angular/view-util.ts b/nativescript-angular/view-util.ts index 476b85336..6212fad1c 100644 --- a/nativescript-angular/view-util.ts +++ b/nativescript-angular/view-util.ts @@ -166,6 +166,7 @@ export class ViewUtil { const viewClass = getViewClass(TEMPLATE); const anchor = this.createAndAttach(TEMPLATE, viewClass, parentElement); anchor.templateParent = parentElement; + anchor.visibility = "collapse"; traceLog("Created templateAnchor: " + anchor); return anchor; } diff --git a/tests/app/tests/modal-dialog.ts b/tests/app/tests/modal-dialog.ts index d8d68d020..93a35ee3e 100644 --- a/tests/app/tests/modal-dialog.ts +++ b/tests/app/tests/modal-dialog.ts @@ -1,12 +1,12 @@ //make sure you import mocha-config before @angular/core -import {assert} from "./test-config"; -import {TestApp} from "./test-app"; -import {Component, ViewContainerRef} from "@angular/core"; -import {Page} from "ui/page"; -import {topmost} from "ui/frame"; -import {ModalDialogParams, ModalDialogService} from "nativescript-angular/directives/dialogs"; - -import {device, platformNames} from "platform"; +import { assert } from "./test-config"; +import { TestApp } from "./test-app"; +import { Component, ViewContainerRef } from "@angular/core"; +import { Page } from "ui/page"; +import { topmost } from "ui/frame"; +import { ModalDialogParams, ModalDialogService } from "nativescript-angular/directives/dialogs"; + +import { device, platformNames } from "platform"; const CLOSE_WAIT = (device.os === platformNames.ios) ? 1000 : 0; @Component({ @@ -37,7 +37,7 @@ export class FailComponent { selector: "sucess-comp", providers: [ModalDialogService], template: ` - + ` }) @@ -73,7 +73,7 @@ describe('modal-dialog', () => { }); - it("showModal throws when there is no modal-dialog-host and no viewContainer provided", (done) => { + it("showModal throws when there is no viewContainer provided", (done) => { testApp.loadComponent(FailComponent) .then((ref) => { const service = ref.instance.service; @@ -81,31 +81,26 @@ describe('modal-dialog', () => { }).then(() => done(), err => done(err)); }); - it("showModal succeeds when there is modal-dialog-host", (done) => { - testApp.loadComponent(SuccessComponent) - .then((ref) => { - const service = ref.instance.service; - return service.showModal(ModalComponent, {}); - }) - .then((res) => setTimeout(done, CLOSE_WAIT), err => done(err)); // wait for the dialog to close in IOS - }); - it("showModal succeeds when there is viewContainer provided", (done) => { testApp.loadComponent(SuccessComponent) .then((ref) => { const service = ref.instance.service; - return service.showModal(ModalComponent, {}); + const comp = ref.instance; + return service.showModal(ModalComponent, { viewContainerRef: comp.vcRef }); }) .then((res) => setTimeout(done, CLOSE_WAIT), err => done(err)); // wait for the dialog to close in IOS }); - it("showModal passes modal params and gets result when resolved", (done) => { const context = { property: "my context" }; testApp.loadComponent(SuccessComponent) .then((ref) => { const service = ref.instance.service; - return service.showModal(ModalComponent, { context: context }); + const comp = ref.instance; + return service.showModal(ModalComponent, { + viewContainerRef: comp.vcRef, + context: context + }); }) .then((res) => { assert.strictEqual(res, context);