Wenn der Ordner „node_modules“ als „excluded“ gekennzeichnet ist, wird bei der Kompilierung nichts aus diesem Ordner gefunden.

Also, rechte Maus auf den Ordner und => Mark Directory as => Cancel Exclusion
Jetzt funktioniert die Kompilierung und auch im Code wird nicht gemeckert, dass was fehlt.

Den Content aus dem Build von Angular in den www-Ordner vom Cordova Build kopieren.

In der index.html des Angular Projekts eine kleine Änderung:

<!-- from -->
<base href="/">
<!-- to -->
<base href="./">

<input [(ngModel)]="myMap.get(id)">

…aber so:

<input [ngModel]="myMap.get(id)" (ngModelChange)="myMap.set(id, $event)">

Danke an stackoverflow.

quantityUnits: key=uuid; value=was zu Anzeigen)
purchaseOrderListItem: das Objekt welches mit der Form angezeigt/bearbeitet werden soll

<div class="">
  <label for="quantityunit_uuid" class="label-tec">Mengeneinheit</label>
  <select id="quantityunit_uuid" name="quantityunit_uuid" class="w3-select" [(ngModel)]="purchaseOrderListItem.quantityunit_uuid">
    <option *ngFor="let quantityUnit of quantityUnits | keyvalue" [value]="quantityUnit.key">{{quantityUnit.value}}</option>
  </select>
</div>

Ein Input mit i10n:

<div class="">
  <label for="purchase_order_list_price" class="label-tec">Preis</label>
  <input id="purchase_order_list_price" class="w3-input"
         #purchase_order_list_price value="{{purchaseOrderListItem.purchase_order_list_price}}"
         (keyup)="updateValue('purchase_order_list_price', purchase_order_list_price.value)"
         l10nDecimal digits="1.2-2">
</div>

JavaScript:

document.getElementById('my_id').value = 42;

TypeScript (3.7.5):

(document.getElementById('my_id') as HTMLInputElement).value = 42;

Dank auch mal wieder an stackoverflow.

und Seiten Reload gibt immer 404.

Um das zu beheben, in der app.module.ts folgendes:

// app.module.ts
import {HashLocationStrategy, LocationStrategy} from '@angular/common';
@NgModule({
  imports: [
    // ...
  ],
  declarations: [
    // ...
  ],
  providers: [
    {provide: LocationStrategy, useClass: HashLocationStrategy},
    // ...
  ],
  bootstrap: [AppComponent],
  exports: []
})
export class AppModule {
}

…und schon funzt es mit Angular 9.

npm install

machen.

nodejs installieren

github.com/nodesource/distributions

npm Notlösung

1.

npm cache clean --force

2. Ordner node_modules leeren
3.

npm install

cannot bind ngModel in child module

um [(ngModel)] in Child Modulen zu verwenden braucht es den Import von FormsModule in dem Child-Module.

// trinket.module.ts
import {FormsModule} from '@angular/forms';
@NgModule({
  imports: [
    CommonModule,
    TrinketRoutingModule,
    FormsModule
  ],
  declarations: [
    TrinketSearchComponent
  exports: [
    TrinketSearchComponent // TrinketSearchComponent soll auch ausserhalb vom TrinketModule verwendet werden
  ],
  providers: [
  ],
})
export class TrinketModule {
}

use component from parent module

Components kann man nicht einfach in app.module.ts bei ‚exports‘ hin schreiben und dann in Child Modulen verwenden. Grund ist, dass die Child Modules die Components aus dem Parent Module nicht erben, auch wenn sie in dem Parent Module bei ‚exports‘ drin steht.

Lösung: man erstellt ein Shared-Module. Das ist ein gewöhnliches Module mit Zeug drin. Hier können wir deklarierte Components bei ‚exports‘ hin schreiben. Dieses Modul können wir in unser Child Module importieren (auch bei ‚imports‘ hin schreiben) und somit deren Components verwenden.

HTTP Client – HttpClientModule

Um mit Angular Requests zu machen, braucht es das HttpClientModule – bzw. in einem Service den HttpClient.

Import HttpClientModule in der root AppModule Klasse:

import { HttpClientModule } from '@angular/common/http';

…und packe es zu den imports:

imports: [
  HttpClientModule,
  BrowserModule,
  AppRoutingModule,
  MyFirstModule, MySecondModule
],