離子：在自定義組件中進行離子選擇

我已經在離子選擇內創建了一個自定義組件。當我嘗試通過將'ngModel'傳遞給不更新的組件來更改值時。離子：在自定義組件中進行離子選擇

幫我解決這個問題，請

下面是代碼：

查找數據，directive.html

<ion-item> 
    <ion-label floating>{{ title }}</ion-label> 
    <ion-select [(ngModel)]="innerValue" [okText]="okText" [cancelText]="cancelText"> 
    <ion-option *ngFor="let item of lookupData" [value]="item.ItemCode"> 
     {{ item.Description }} 
    </ion-option> 
    </ion-select> 
</ion-item>

查找數據，directive.ts

import { Component, ElementRef, Input, forwardRef } from '@angular/core'; 
import { TranslateService } from '@ngx-translate/core' 
import { Loading, LoadingController, AlertController, NavParams } from "ionic-angular"; 
import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms'; 

import { LookupDataModel } from "../../models/LookupDataModel"; 

import { LookupDataProvider } from '../../providers/LookupDataProvider'; 
import { RequestTasksProvider } from "../../providers/RequestTasksProvider"; 


const noop =() => { 
}; 

export const CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = { 
    provide: NG_VALUE_ACCESSOR, 
    useExisting: forwardRef(() => LookupDataDirective), 
    multi: true 
}; 

@Component({ 
    selector: 'lookup-data', 
    templateUrl: 'lookup-data-directive.html', 
    providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR] 
}) 
export class LookupDataDirective implements ControlValueAccessor { 
    private innerValue: any = ''; 
    loader: Loading; 
    lookupData: LookupDataModel[]; 

    @Input() title: string; 
    @Input() okText: string; 
    @Input() cancelText: string; 
    @Input() tableCode: number; 

    private onTouchedCallback:() => void = noop; 
    private onChangeCallback: (_: any) => void = noop; 

    constructor(
     private translate: TranslateService, 
     private loadingCtrl: LoadingController, 
     private alertCtrl: AlertController, 
     private lookupDataProvider: LookupDataProvider) { 
    } 

    writeValue(value: any) { 
     if (value !== this.innerValue) { 
      this.innerValue = value; 
     } 
    } 

    registerOnChange(fn: any): void { 
     console.log('registerOnChange'); 
     this.onChangeCallback = fn; 
    } 

    registerOnTouched(fn: any): void { 
     this.onTouchedCallback = fn; 
    } 

    get value(): any { 
     return this.innerValue; 
    }; 

    set value(v: any) { 
     if (v !== this.value) { 
      this.innerValue = v; 
      this.onChangeCallback(v); 
     } 
    } 

    onBlur() { 
     this.onTouchedCallback(); 
    } 

    ngOnInit() { 
     this.loadLookupData(); 
    } 

    loadLookupData() { 
     //here i load the data from api 
    } 

}

這裏我試着通過這個模型：

<lookup-data [title]="lookupDataTitle" 
       [tableCode]="lookupIndex" 
       [okText]="okText" 
       [cancelText]="cancelText" 
       [(ngModel)]="model.CancelationCode"> 
    </lookup-data>

來源

2017-07-19 Andrey Serdyuk

model.CancelationCode - 這是我嘗試更新的模式，但它不是由某種原因發生 –

<ion-select [(ngModel)]="innerValue" [okText]="okText" [cancelText]="cancelText">

這裏我應該傳遞 '設定值' 的方法，而不是一個innerValue PARAM。

所以我通過固定它：

<ion-select [(ngModel)]="value" [okText]="okText" [cancelText]="cancelText">

來源

2017-07-20 08:27:37

離子：在自定義組件中進行離子選擇

回答

相關問題