'এইচটিএমলেমেন্ট' প্রকারের মানটিতে সম্পত্তি 'মান' বিদ্যমান নেই


235

আমি টাইপস্ক্রিপ্টের সাথে চারপাশে খেলছি এবং একটি স্ক্রিপ্ট তৈরি করার চেষ্টা করছি যা একটি ইনপুট বাক্সে পাঠ্য ইনপুট করা হওয়ায় কোনও পি-এলিমেন্ট আপডেট করবে।

এইচটিএমএল নীচের মত দেখাচ্ছে:

<html>
    <head>
    </head>
    <body>
        <p id="greet"></p>
        <form>
            <input id="name" type="text" name="name" value="" onkeyup="greet('name')" />
        </form>
    </body>
    <script src="greeter.js"></script>
</html>

এবং greeter.tsফাইল:

function greeter(person)
{
    return "Hello, " + person;
}

function greet(elementId)
{
    var inputValue = document.getElementById(elementId).value;

    if (inputValue.trim() == "")
        inputValue = "World";

    document.getElementById("greet").innerText = greeter(inputValue);
}

আমি যখন সংকলন করি তখন আমি tscনিম্নলিখিত "ত্রুটি" পাই:

/home/bjarkef/sandbox/greeter.ts(8,53): The property 'value' does not exist on value of type 'HTMLElement'

তবে সংকলক একটি জাভাস্ক্রিপ্ট ফাইল আউটপুট করে যা ক্রোমে ঠিকঠাক কাজ করে।

আমি কীভাবে এই ত্রুটি পেতে পারি? এবং আমি কীভাবে এটি ঠিক করতে পারি?

এছাড়াও, 'HTMLElement'টাইপস্ক্রিপ্ট অনুসারে কোন বৈশিষ্ট্যগুলি বৈধ তা আমি কোথায় সন্ধান করতে পারি ?

দয়া করে নোট করুন আমি জাভাস্ক্রিপ্ট এবং টাইপস্ক্রিপ্টে খুব নতুন, তাই আমি স্পষ্ট কিছু অনুপস্থিত হতে পারে। :)

উত্তর:


448

টমাসজ নুরকিউইকস উত্তরগুলির উপর ভিত্তি করে, "সমস্যা" হ'ল টাইপস্ক্রিপ্ট টাইপসেফ। :) সুতরাং document.getElementById()প্রকারটি HTMLElementধরণটি দেয় যাতে কোনও valueসম্পত্তি থাকে না । সাব টাইপটি HTMLInputElementতবে থাকেvalue সম্পত্তি।

সুতরাং একটি সমাধান ফল নিক্ষেপ হয় getElementById()থেকে HTMLInputElementভালো:

var inputValue = (<HTMLInputElement>document.getElementById(elementId)).value;

<>টাইপ স্ক্রিপ্টে ingালাই অপারেটর। প্রশ্নটি দেখুন টাইপস্ক্রিপ্ট: কাস্টিং এইচটিএমলেমেন্ট ।

উপরের রেখাটি থেকে ফলাফল জাভাস্ক্রিপ্টটি এর মতো দেখাচ্ছে:

inputValue = (document.getElementById(elementId)).value;

অর্থাত্ কোনও ধরণের তথ্য নেই।


এইচটিএমএল এর কোন উপাদানটি টাইপস্ক্রিপ্টের জন্য কোন প্রকারের জন্য অন্তর্ভুক্ত রয়েছে তার কোনও তালিকা আছে? যদি হ্যাঁ হয় তবে এটি পোস্ট কারওর জন্য সহায়ক হবে !! মহান উত্তরের জন্য ধন্যবাদ।
— পরদীপ জৈন

1
এই ফিক্সটি আমার কোডটিকে পুরোপুরি ভঙ্গ করে; এরপরে যা কিছু আসে তা বলে "কোনও ফাংশন নয়"। টিএস যেভাবে এটি পরিচালনা করে তার পিছনে যুক্তি আমি বুঝতে পারি না; যেহেতু getElementById যে কোনও উপাদান টাইপ ফিরিয়ে দিতে পারে, যে কোনওটিকে ডিফল্টরূপে গ্রহণ করা উচিত।
— কচ্ছপগুলি

@ টার্টলসআরেকিউট আমি কী কৌতূহল করছি যে কীভাবে এই সমাধানটি আপনার কোড ভঙ্গ করেছে। আশা করছি এক বছর পরে আপনি একটি সমাধান খুঁজে পেয়েছেন, তবে এইচটিএমএলপুটমেটমেন্টে কাস্টিংয়ের কাজ করা উচিত ছিল।
— মিশাল পোলা

আমার ক্ষেত্রে, আমাকে এটি HTMLAunchorElement এ পরিবর্তন করতে হয়েছিল।
— ওয়াইল্ডহ্যামার

@ উইলডামার কারণ আপনার উপাদানটি কোনও ইনপুট উপাদান ছিল না ! ওপি'র হয়।
— অ্যাস্পেক্স ২

68

আপনি যদি প্রতিক্রিয়া ব্যবহার করছেন তবে আপনি asঅপারেটরটি ব্যবহার করতে পারেন ।

let inputValue = (document.getElementById(elementId) as HTMLInputElement).value;

3
কিছু কারণে, এখানে গৃহীত উত্তরটি আমার জন্য নিম্নলিখিত ত্রুটি বাড়িয়ে তুলছিল: জেএসএক্স উপাদান 'এইচটিএমএল ইনপুট এলিমেন্ট' এর কোনও সমাপ্তির ট্যাগ নেই। এই উত্তরটি আমার পক্ষে কাজ করেছিল।
— নাইজেল টুফেল

1
কারণটি হ'ল tsx ফাইলগুলিতে আপনি <>অপারেটরগুলি cast ালতে ব্যবহার করতে পারবেন না , কারণ এগুলি প্রতিক্রিয়াতে ব্যবহৃত হয়। সুতরাং আপনাকে যেমনটি ব্যবহার করতে হবে: বেসরট.এইটি.বুকগুলি.আইও
— পাউডারহাম

যদিও এটি আমার পক্ষে কাজ করে নি, এটি আমাকে সঠিক দিকনির্দেশনা দিয়েছে :) আপ ভোট !!!
— সাইমন দাম

40

আপনি HTMLInputElement এ আপডেট করতে চান উপাদানটি কাস্ট করার চেষ্টা করুন। অন্যান্য উত্তরে বর্ণিত হিসাবে আপনাকে সংকলককে ইঙ্গিত করতে হবে যে এটি একটি নির্দিষ্ট ধরণের এইচটিএমলেমেন্ট:

var inputElement = <HTMLInputElement>document.getElementById('greet');
inputElement.value = greeter(inputValue);


17

এর জন্য একটি দ্রুত ফিক্সটি হ'ল বৈশিষ্ট্য নির্বাচন করতে [] ব্যবহার করুন।

function greet(elementId) {
    var inputValue = document.getElementById(elementId)["value"];
    if(inputValue.trim() == "") {
        inputValue = "World";
    }
    document.getElementById("greet").innerText = greeter(inputValue);
}

আমি মাত্র কয়েকটি পদ্ধতি চেষ্টা করে দেখুন এবং এই সমাধানটি বের করতে,
আপনার মূল স্ক্রিপ্টের পিছনে কী সমস্যা আছে তা আমি জানি না।

রেফারেন্সের জন্য আপনি টমাসজ নুরকিউইজকের পোস্টটি উল্লেখ করতে পারেন।


প্রশ্নের যথাযথ উত্তর, আমাকে অনেক সাহায্য করেছে।
— মনির খান

15

সমস্যাটি এখানে:

document.getElementById(elementId).value

আপনি জানেন যে HTMLElementফিরে এসেছিল getElementById()এটি থেকে HTMLInputElementউত্তরাধিকার সূত্রে একটি উদাহরণ কারণ আপনি ইনপুট উপাদানটির একটি আইডি পাস করছেন। একইভাবে স্থিতিযুক্ত জাভাতে এটি সংকলন করবে না:

public Object foo() {
  return 42;
}

foo().signum();

signum()একটি পদ্ধতি Integer, কিন্তু কম্পাইলার শুধুমাত্র স্ট্যাটিক টাইপ জানেন foo(), যা Object। এবং Objectএকটি নেইsignum() পদ্ধতি নেই।

তবে সংকলকটি এটি জানতে পারে না, এটি কেবল স্থির ধরণের উপর ভিত্তি করেই করতে পারে, আপনার কোডটির গতিশীল আচরণ নয়। এবং যতদূর সংকলক জানে, document.getElementById(elementId)মত প্রকাশের ধরণটি নেইvalue সম্পত্তি নেই। কেবল ইনপুট উপাদানগুলিরই মান থাকে।

একটি রেফারেন্স চেক HTMLElementএবং HTMLInputElementMDN এ। আমার ধারণা টাইপসক্রিপ্ট এগুলির সাথে কমবেশি সামঞ্জস্যপূর্ণ।


তবে আমি .valueপি উপাদানটিতে অ্যাক্সেস করছি না , আমি এটি inputউপাদানটিতে অ্যাক্সেস করছি । নাকি আমি ভুল করছি?
— বার্জারে ফ্রুন্ড-হ্যানসেন

1
@ বাজরেকেফ: আপনি ফোন করছেন document.getElementById("greet")এবং আপনার কাছে রয়েছে <p id="greet"></p>...
— টমাসজ নুরকিউইচ

আমি আহ্বান করছি document.getElementById("greet").innerTextযা পুরোপুরি টিকে বৈধ হতে হবে আমি শুধু প্রবেশ করতে চাই, valueধারণকারী লাইনে ইনপুট উপাদান সম্পত্তি: var inputValue = document.getElementById(elementId).value;মধ্যে greet(elementId)এবং যে HTML এ বলা হয় onkeyup="greet('name')"ইনপুট আকারে। সুতরাং আমি মনে করি আপনি কোডটি ভুলভাবে পড়ছেন, আমি ভুল হলে দয়া করে আমাকে সংশোধন করুন। :)
— বার্জার ফ্রেইন্ড-হানসেন

@ বারজারেফ: দুঃখিত, আপনি ঠিক বলেছেন। আমি আমার উত্তরটি আবার লিখেছি, একবার দেখুন!
— টমাসজ নুরকিউইচ

1
আহ, এই বোঝা যায়। সুতরাং আমি থেকে ফিরে আসা মানটি কাস্ট করা উচিত getElementByIdএবং আমি টাইপ স্ক্রিপ্টে এটি কীভাবে করব? নাকি getElementByIdসেই রিটার্ন ছাড়া আর কোন পদ্ধতি আছে HTMLInputElement?
— বার্জার ফ্রেইন্ড-হানসেন

11

আপনার "ডকলেটআইডস" ব্যতীত প্রপস বা রেফসের মতো বৈশিষ্ট্য ব্যবহারকারী যে কেউ তার জন্য আপনি তখন করতে পারেন:

("" as HTMLInputElement).value;

যেখানে উল্টানো উদ্ধৃতিগুলি আপনার প্রপস মান তাই উদাহরণটি এরকম হবে:

var val = (this.refs.newText as HTMLInputElement).value;
alert("Saving this:" + val);

4

আপনি যদি কৌণিক ব্যবহার করছেন তবে আপনি ব্যবহার করতে পারেন -

const element = document.getElementById('elemId') as HTMLInputElement;


-1

সমস্যা:

ত্রুটি সম্পত্তি 'পাঠ্য' টাইপ 'এইচটিএমলেমেন্ট' তে বিদ্যমান নেই

সমাধান: টাইপস্ক্রিপ্টে আমাদের কাস্ট করতে হবে document.getElementById()যা টাইপ করে returnsHTMLElement করে করে< HTMLScriptElement >

সুতরাং আমরা টাইপসক্রিপটি.জেএস দ্বারা প্রত্যাশা অনুযায়ী ত্রুটিটি সমাধান করার উপায় অনুসরণ করে এটি করতে পারি

Code: var content: string = ( < HTMLScriptElement > document.getElementById(contentId)).text;

এটি আমার পক্ষে কাজ করেছে .. আশা করি এটি আপনার জন্যও কার্যকর হয়।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.