NativeScript Dropdown-Plugin Angular - Fehler beim Öffnen des Objekts

Question

Ich versuche, das nativescript Dropdown-Plugin in meinem Nativescript-eckigen Projekt zu verwenden.

Ich habe versucht, die gleichen Schritte zu folgen, die in dem Beispielprojekt erwähnt sind, das der Autor erwähnte. Aber ich erhalte den folgenden Fehler.

JS: Drop Down opened. System.err: com.tns.NativeScriptException: System.err: Calling js method getDropDownView failed System.err: Error: java.lang.NullPointerException System.err:
android.widget.TextView.setTextColor(TextView.java:3147) System.err:
com.tns.Runtime.callJSMethodNative(Native Method) System.err:
com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1084) System.err: com.tns.Runtime.callJSMethodImpl(Runtime.java:966) System.err: com.tns.Runtime.callJSMethod(Runtime.java:953) System.err: com.tns.Runtime.callJSMethod(Runtime.java:937) System.err: com.tns.Runtime.callJSMethod(Runtime.java:929)

Hier ist das AppModule. Ich habe das Dropdown-Modul wie im Beispiel beschrieben importiert.

@NgModule({ 
    bootstrap: [ 
     AppComponent 
    ], 
    imports: [ 
     NativeScriptModule, 
     AppRoutingModule, 
     NativeScriptCommonModule, 
     NativeScriptFormsModule, 
     NativeScriptHttpModule, 
     DropDownModule 
    ], 
    declarations: [ 
     AppComponent, 
     ItemsComponent, 
     ItemDetailComponent, 
     CustomerListComponent, 
     CustomerDetailComponent, 
     LoginComponent, 
     HomeComponent, 
     ProductListComponent, 
     TestComponentClass 
    ], 
    providers: [ 
     ItemService 
    ], 
    schemas: [ 
     NO_ERRORS_SCHEMA 
    ] 
}) 

Ich habe die gleiche .ts Klasse verwendet, die im Beispiel erklärt wird.

import { Component, OnInit } from '@angular/core'; 
import { SelectedIndexChangedEventData,ValueList } from "nativescript-drop-down"; 

@Component({ 
    selector: "ns-test-c", 
    moduleId: module.id, 
    templateUrl: "./test.component.html", 
    // styleUrls: ["./test.component.css"] 
}) 

export class TestComponentClass implements OnInit{ 

    public selectedIndex: number = null; 
    public hint     = "My Hint"; 
    public items: ValueList<string>; 
    public cssClass: string  = "default"; 

    public ngOnInit() { 
     this.items = new ValueList<string>(); 
     for (let loop = 0; loop < 200; loop++) { 
      this.items.push({ 
       value: `I${loop}`, 
       display: `Item ${loop}`, 
      }); 
     } 
    } 

    public onchange(args: SelectedIndexChangedEventData) { 
     console.log(`Drop Down selected index changed from ${args.oldIndex} to ${args.newIndex}. New value is "${this.items.getValue(
      args.newIndex)}"`); 
    } 

    public onopen() { 
     console.log("Drop Down opened."); 
    } 

    public onclose() { 
     console.log("Drop Down closed."); 
    } 

    public changeStyles() { 
     this.cssClass = "changed-styles"; 
    } 
} 

package.json: Dies sind die installierten Pakete.

{ 
    "description": "NativeScript Application", 
    "license": "SEE LICENSE IN <your-license-filename>", 
    "readme": "NativeScript Application", 
    "repository": "<fill-your-repository-here>", 
    "nativescript": { 
     "id": "org.nativescript.Kiwi", 
     "tns-android": { 
      "version": "3.2.0" 
     } 
    }, 
    "dependencies": { 
     "@angular/animations": "~4.2.0", 
     "@angular/common": "~4.2.0", 
     "@angular/compiler": "~4.2.0", 
     "@angular/core": "~4.2.0", 
     "@angular/forms": "~4.2.0", 
     "@angular/http": "~4.2.0", 
     "@angular/platform-browser": "~4.2.0", 
     "@angular/router": "~4.2.0", 
     "nativescript-angular": "~4.2.0", 
     "nativescript-cardview": "^2.0.2", 
     "nativescript-drop-down": "^3.1.3", 
     "nativescript-floatingactionbutton": "^3.0.1", 
     "nativescript-theme-core": "~1.0.2", 
     "reflect-metadata": "~0.1.8", 
     "rxjs": "~5.4.2", 
     "tns-core-modules": "^3.2.0", 
     "zone.js": "~0.8.2" 
    }, 
    "devDependencies": { 
     "babel-traverse": "6.4.5", 
     "babel-types": "6.4.5", 
     "babylon": "6.4.5", 
     "lazy": "1.0.11", 
     "nativescript-dev-typescript": "~0.5.0", 
     "typescript": "~2.4.2" 
    } 
} 

Answer 1

<DropDown #dd 
      color="blue" <!- add this in...it work!!!! --> 
      backroundColor="red" `enter code here` 
      [items]="items" 
      [(ngModel)]="selectedIndex" 
      (selectedIndexChanged)="onchange($event)" 
      (opened)="onopen()" 
      (closed)="onclose()" 
      row="0" 
      colSpan="2"> 
     </DropDown>