feat: add angular 19 support

Author: edusperoni

apps/nativescript-demo-ng/src/app/app.component.ts

@@ -5,6 +5,7 @@ import { Component, ViewContainerRef, OnInit, OnDestroy } from '@angular/core';
   selector: 'ns-app',
   moduleId: module.id,
   templateUrl: './app.component.html',
+  standalone: false,
 })
 export class AppComponent implements OnInit, OnDestroy {
   constructor(private vcRef: ViewContainerRef) {}

apps/nativescript-demo-ng/src/app/home/home.component.ts

@@ -7,6 +7,7 @@ import { Page, TabView } from '@nativescript/core';
   moduleId: module.id,
   selector: 'demo-home',
   templateUrl: './home.component.html',
+  standalone: false,
 })
 export class HomeComponent implements OnInit {
   tabItems: { [key: string]: { index: number; title?: string; iconSource?: string; textTransform?: string } } = {};

apps/nativescript-demo-ng/src/app/item/item-detail.component.ts

@@ -7,14 +7,15 @@ import { ItemService } from './item.service';
 @Component({
   selector: 'ns-details',
   moduleId: module.id,
-  templateUrl: './item-detail.component.html'
+  templateUrl: './item-detail.component.html',
+  standalone: false,
 })
 export class ItemDetailComponent implements OnInit {
   item: Item;
 
   constructor(
     private itemService: ItemService,
-    private route: ActivatedRoute
+    private route: ActivatedRoute,
   ) {}
 
   ngOnInit(): void {

apps/nativescript-demo-ng/src/app/item/items.component.ts

@@ -10,6 +10,7 @@ import { ModalDialogService, NativeDialogService } from '@nativescript/angular';
   selector: 'ns-items',
   moduleId: module.id,
   templateUrl: './items.component.html',
+  standalone: false,
 })
 export class ItemsComponent implements OnInit, OnDestroy {
   message = 'Hello Angular 18!';

apps/nativescript-demo-ng/src/app/item2/item-detail2.component.ts

@@ -9,6 +9,7 @@ import { ItemService } from '../item/item.service';
   selector: 'ns-details2',
   moduleId: module.id,
   templateUrl: './item-detail2.component.html',
+  standalone: false,
 })
 export class ItemDetailComponent implements OnInit, OnDestroy {
   item: Item;

apps/nativescript-demo-ng/src/app/item3/items.component.ts

@@ -10,9 +10,10 @@ import { ModalDialogService, NativeDialogService } from '@nativescript/angular';
   selector: 'ns-items',
   moduleId: module.id,
   templateUrl: './items.component.html',
+  standalone: false,
 })
 export class ItemsComponent implements OnInit, OnDestroy {
-  message = 'Hello Angular 18';
+  message = 'Hello Angular 19';
   items: Array<Item>;
   borderRadius: number;
   fontSize: number;

apps/nativescript-demo-ng/src/app/modal/modal.component.ts

@@ -6,6 +6,7 @@ import { View } from '@nativescript/core';
 @Component({
   selector: 'ns-modal',
   templateUrl: `./modal.component.html`,
+  standalone: false,
 })
 export class ModalComponent implements OnInit, OnDestroy {
   id = Math.floor(Math.random() * 1000);
@@ -46,15 +47,16 @@ export class ModalComponent implements OnInit, OnDestroy {
   loadedImg(args) {
     this.img = args.object as View;
     const scaleImage = (up: boolean) => {
-      this.img.animate({
-        scale: { x: up ? 1.5 : 1.0, y: up ? 1.5 : 1.0},
-        translate: { x: up ? -100 : 0, y: 0},
-        duration: 1000,
-
-      }).then(() => {
-        scaleImage(up ? false : true);
-      })
-    }
+      this.img
+        .animate({
+          scale: { x: up ? 1.5 : 1.0, y: up ? 1.5 : 1.0 },
+          translate: { x: up ? -100 : 0, y: 0 },
+          duration: 1000,
+        })
+        .then(() => {
+          scaleImage(up ? false : true);
+        });
+    };
     scaleImage(true);
   }
 }

apps/nativescript-demo-ng/src/tests/detached-loader-tests.spec.ts

@@ -1,13 +1,14 @@
 // make sure you import mocha-config before @angular/core
-import { NgModule, Directive, ChangeDetectionStrategy, Component, ViewChild, NO_ERRORS_SCHEMA } from '@angular/core';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ChangeDetectionStrategy, Component, Directive, NgModule, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import { DetachedLoader, NativeScriptModule } from '@nativescript/angular';
 import { NativeScriptTestingModule } from '@nativescript/angular/testing';
 // import { NS_COMPILER_PROVIDERS } from "@nativescript/angular/platform";
 import { CommonModule } from '@angular/common';
 
 @Component({
   template: `<StackLayout><Label text="COMPONENT"></Label></StackLayout>`,
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestComponent {}
 
@@ -23,6 +24,8 @@ class LoaderComponentBase {
       <DetachedContainer #loader></DetachedContainer>
     </StackLayout>
   `,
+  imports: [DetachedLoader],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class LoaderComponent extends LoaderComponentBase {}
 
@@ -34,22 +37,22 @@ export class LoaderComponent extends LoaderComponentBase {}
       <DetachedContainer #loader></DetachedContainer>
     </StackLayout>
   `,
+  imports: [DetachedLoader],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 // eslint-disable-next-line @angular-eslint/component-class-suffix
 export class LoaderComponentOnPush extends LoaderComponentBase {}
 
 @NgModule({
-  declarations: [LoaderComponent, LoaderComponentOnPush, TestComponent],
-  imports: [NativeScriptModule, NativeScriptTestingModule, CommonModule],
+  imports: [LoaderComponent, LoaderComponentOnPush, TestComponent],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class EntryComponentsTestModule {}
 describe('DetachedLoader', function () {
   // this.timeout(4000);
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [LoaderComponent, LoaderComponentOnPush, TestComponent],
-      imports: [NativeScriptModule, NativeScriptTestingModule, CommonModule],
+      imports: [NativeScriptModule, NativeScriptTestingModule, CommonModule, LoaderComponent, LoaderComponentOnPush, TestComponent],
       schemas: [NO_ERRORS_SCHEMA],
     });
     return TestBed.compileComponents();

apps/nativescript-demo-ng/src/tests/detached-utils-tests.spec.ts

@@ -5,6 +5,7 @@ import { GridLayout, ProxyViewContainer } from '@nativescript/core';
 
 @Component({
   template: `<ng-container #vc></ng-container><ng-template #template><GridLayout></GridLayout></ng-template>`,
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class GenerateViewComponent {
   @ViewChild('vc', { read: ViewContainerRef }) vc: ViewContainerRef;
@@ -14,11 +15,12 @@ export class GenerateViewComponent {
 
 @Component({
   template: `<GridLayout></GridLayout>`,
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class GeneratedComponent {}
 
 @NgModule({
-  declarations: [GeneratedComponent, GenerateViewComponent],
+  imports: [GeneratedComponent, GenerateViewComponent],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class GeneratedModule {}
@@ -28,7 +30,7 @@ describe('generateNativeScriptView', () => {
   let cleanup: Array<NgViewRef<unknown> | ComponentRef<unknown> | EmbeddedViewRef<unknown>> = [];
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [GenerateViewComponent, GeneratedComponent],
+      imports: [GenerateViewComponent, GeneratedComponent],
     }).compileComponents();
     fixture = TestBed.createComponent(GenerateViewComponent);
     fixture.detectChanges();

apps/nativescript-demo-ng/src/tests/list-view-tests.spec.ts

@@ -1,12 +1,15 @@
-import { Component, Input, NgModule, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
+import { Component, Input, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
 import { TestBed, waitForAsync } from '@angular/core/testing';
-import { ListViewComponent, NativeScriptModule } from '@nativescript/angular';
+import { ListViewComponent, TemplateKeyDirective } from '@nativescript/angular';
 // import trace = require("trace");
 // trace.setCategories("ns-list-view, " + trace.categories.Navigation);
 // trace.enable();
 
 class DataItem {
-  constructor(public id: number, public name: string) {}
+  constructor(
+    public id: number,
+    public name: string,
+  ) {}
 }
 
 const ITEMS = [new DataItem(0, 'data item 0'), new DataItem(1, 'data item 1'), new DataItem(2, 'data item 2')];
@@ -24,6 +27,8 @@ let testTemplates: { first: number; second: number };
       </ListView>
     </GridLayout>
   `,
+  imports: [ListViewComponent],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestListViewComponent {
   public myItems: Array<DataItem> = ITEMS;
@@ -63,6 +68,8 @@ export class ItemTemplateComponent {
       </ListView>
     </GridLayout>
   `,
+  imports: [ListViewComponent, TemplateKeyDirective, ItemTemplateComponent],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestListViewSelectorComponent {
   public myItems: Array<DataItem> = ITEMS;
@@ -94,6 +101,8 @@ export class TestListViewSelectorComponent {
       </ListView>
     </GridLayout>
   `,
+  imports: [ListViewComponent, TemplateKeyDirective, ItemTemplateComponent],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestListViewSelectorWithEventsComponent {
   public myItems: Array<DataItem> = ITEMS;
@@ -115,6 +124,8 @@ export class TestListViewSelectorWithEventsComponent {
       <ListView #listView [items]="myItems"></ListView>
     </GridLayout>
   `,
+  imports: [ListViewComponent],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestDefaultItemTemplateComponent {
   public myItems: Array<DataItem>;
@@ -132,20 +143,12 @@ export class TestDefaultItemTemplateComponent {
 
 const declarations = [TestListViewComponent, TestListViewSelectorComponent, ItemTemplateComponent, TestDefaultItemTemplateComponent, TestListViewSelectorWithEventsComponent];
 
-@NgModule({
-  declarations: [...declarations],
-  imports: [NativeScriptModule],
-  schemas: [NO_ERRORS_SCHEMA],
-})
-export class ListViewModule {}
-
 describe('ListView-tests', () => {
   beforeEach(() =>
     TestBed.configureTestingModule({
-      declarations: [...declarations],
-      imports: [NativeScriptModule],
+      imports: declarations,
       schemas: [NO_ERRORS_SCHEMA],
-    }).compileComponents()
+    }).compileComponents(),
   );
 
   it('setupItemView is called for every item', waitForAsync(async () => {