deprecate modal-dialog-host

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<any>, options: ModalDialogOptions): Promise<any> {
- 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);
  }
 }

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);
 };

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<NgModuleRef<any>>();
 export const onAfterLivesync = new EventEmitter<NgModuleRef<any>>();

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;
  }

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: `
- <GridLayout modal-dialog-host margin="20">
+ <GridLayout margin="20">
  <Label text="Modal dialogs"></Label>
  </GridLayout>`
 })
@@ -73,39 +73,34 @@ 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 = <ModalDialogService>ref.instance.service;
  assert.throws(() => service.showModal(ModalComponent, {}), "No viewContainerRef: Make sure you pass viewContainerRef in ModalDialogOptions.");
  }).then(() => done(), err => done(err));
  });
 
- it("showModal succeeds when there is modal-dialog-host", (done) => {
- testApp.loadComponent(SuccessComponent)
- .then((ref) => {
- const service = <ModalDialogService>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 = <ModalDialogService>ref.instance.service;
- return service.showModal(ModalComponent, {});
+ const comp = <SuccessComponent>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 = <ModalDialogService>ref.instance.service;
- return service.showModal(ModalComponent, { context: context });
+ const comp = <SuccessComponent>ref.instance;
+ return service.showModal(ModalComponent, {
+ viewContainerRef: comp.vcRef,
+ context: context
+ });
  })
  .then((res) => {
  assert.strictEqual(res, context);