2017-02-06 16 views
15

पर मौजूद नहीं है मैं एक कोणीय 2 घटक कोड के लिए टाइपस्क्रिप्ट संस्करण 2 का उपयोग कर रहा हूं।संपत्ति 'मान' प्रकार 'EventTarget'

मुझे त्रुटि मिल रही है "संपत्ति 'मान' नीचे दिए गए कोड के लिए 'EventTarget' प्रकार पर मौजूद नहीं है, समाधान क्या हो सकता है। धन्यवाद!

e.target.value.match (/ \ S +/g) || [])। लंबाई

import { Component, EventEmitter, Output } from '@angular/core'; 

@Component({ 
selector: 'text-editor', 
template: ` 
<textarea (keyup)="emitWordCount($event)"></textarea> 
` 
}) 
    export class TextEditorComponent { 
    @Output() countUpdate = new EventEmitter<number>(); 

emitWordCount(e: Event) { 
    this.countUpdate.emit(
     (e.target.value.match(/\S+/g) || []).length); 
} 
} 

उत्तर

35

आप स्पष्ट रूप से टाइपप्रति HTMLElement जो अपने लक्ष्य है के प्रकार बताने के लिए की जरूरत है।

जिस तरह से यह एक उचित प्रकार से यह कास्ट करने के लिए एक सामान्य प्रकार का उपयोग करना:

this.countUpdate.emit((<HTMLTextAreaElement>e.target).value./*...*/) 

यह टाइपप्रति जानते हैं कि तत्व एक textarea है दूँगी और यह मूल्य संपत्ति का पता चल जाएगा।

यह किसी भी प्रकार के HTML तत्व के साथ किया जा सकता है, जब भी आप टाइपस्क्रिप्ट को अपने प्रकार के बारे में थोड़ी अधिक जानकारी देते हैं तो यह आपको उचित संकेतों और निश्चित रूप से कम त्रुटियों के साथ वापस देता है।

बनाने के लिए इसे आसान भविष्य के लिए आप सीधे अपने लक्ष्य के प्रकार के साथ किसी घटना को परिभाषित करने के लिए चाहते हो सकता है:

// create a new type HTMLElementEvent that has a target of type you pass 
// type T must be a HTMLElement (e.g. HTMLTextAreaElement extends HTMLElement) 
type HTMLElementEvent<T extends HTMLElement> = Event & { 
    target: T; 
    // probably you might want to add the currentTarget as well 
    // currentTarget: T; 
} 

// use it instead of Event 
let e: HTMLElementEvent<HTMLTextAreaElement>; 

console.log(e.target.value); 

// or in the context of the given example 
emitWordCount(e: HTMLElementEvent<HTMLTextAreaElement>) { 
    this.countUpdate.emit(e.target.value); 
} 
+0

यह केवल HTML टैग के साथ काम करता है, प्राइमेंग टैग के बारे में क्या? –

+0

@atishshimpi 'primeng टैग के बारे में क्या? यह प्रश्न और इस जवाब से विशेष रूप से कैसे संबंधित है? – smnbbrv

+1

मैन, बहुत धन्यवाद! –

2

मेरा मानना ​​है कि यह काम करना चाहिए, लेकिन किसी भी तरीके मैं पहचान करने में सक्षम नहीं हूँ। अन्य दृष्टिकोण हो सकता है,

<textarea (keyup)="emitWordCount(myModel)" [(ngModel)]="myModel"></textarea> 


export class TextEditorComponent { 
    @Output() countUpdate = new EventEmitter<number>(); 

    emitWordCount(model) { 
     this.countUpdate.emit(
     (model.match(/\S+/g) || []).length); 
     } 
} 
संबंधित मुद्दे