nativescript-angular:无法设置默认情况下选中的下拉菜单

时间:2019-11-28 05:45:14

标签: nativescript nativescript-angular

我的页面上有一个下拉列表。我试图将默认值保留为默认值。

我为此目的使用了[selectedIndex]="selectedIndex" 但是该值未设置为选定值。

fruit.component.html

    <StackLayout orientation='horizontal' height="80" width="100%">
        <DropDown class="dropdown"  [items]="fruitsList" hint="Select" #fruit 
             [(ngModel)]="selectedFruitIndex" [selectedIndex]="selectedIndex" 
            (selectedIndexChanged)="onDropdownChange($event)" (opened)="onDropdownOpen()" 
            android:marginBottom="-20" ios:marginBottom="0" (closed)="onDropdownClose()">
        </DropDown>
    </StackLayout>

fruit.component.ts

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

@Component({
    selector: "fruit",
    templateUrl: "./fruit.component.html",
    styleUrls: ['./fruit.component.scss']
})
export class FruitComponent implements OnInit {
    @ViewChild('fruit', { static: true }) fruit: ElementRef;
    selectedFruitIndex: any;
    selectedIndex: number = 0;
    fruitsList: string[] = [];
    constructor() {
        this.fruitsList.push("Apple"); //keep this as selected by defaullt
    }

    ngOnInit() {
        this.fruitsList.push("Orange");
        this.fruitsList.push("Grapes");
      }

    ddOpen(): void {
        if (isIOS) {
            if (this.fruit.nativeElement.selectedIndex == null) {
                this.fruit.nativeElement.selectedIndex = 0;
            }
        }
    }

    ddClose() {
        if (isIOS) {
            this.selectedIndex = this.selectedFruitIndex;
        }
    }

    onddChange(args: SelectedIndexChangedEventData) {
        if (isAndroid) {
            this.selectedIndex = args.newIndex;
        }
    }
}

0 个答案:

没有答案