我正在尝试在我的Nativescript-angular项目中使用nativescript下拉插件。
我尝试按照作者提到的示例项目中提到的相同步骤进行操作。但我收到以下错误。
JS:Drop Down打开了。 System.err:com.tns.NativeScriptException: System.err:调用js方法getDropDownView失败System.err: 错误: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)
这是AppModule。我按照示例中的说明导入了下拉模块。
@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
]
})
我使用了相同的.ts类,在示例中对此进行了解释。
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:下面是已安装的软件包。
{
"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"
}
}
答案 0 :(得分: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>