@ ভিউচিল্ড এবং @ কনটেন্টচিল্ডের মধ্যে পার্থক্য কী?

Question

কৌণিক 2 উপলব্ধ @ViewChild, @ViewChildren, @ContentChildএবং @ContentChildrenএকটি উপাদান এর বংশধর উপাদান অনুসন্ধানের জন্য আলোকচিত্রী।

প্রথম দুটি এবং দ্বিতীয়টির মধ্যে পার্থক্য কী?

Comments

এই লিঙ্কটি নীচের উত্তরগুলি পড়ার পরে আমাকে blog.mgechev.com/2016/01/23/… সহায়তা করেছিল । চিয়ার্স :)

— গোপীনাথ শিব

Answer 1

আমি শ্যাডো ডোম এবং লাইট ডিওএম পরিভাষা ব্যবহার করে আপনার প্রশ্নের উত্তর দেব (এটি ওয়েব উপাদান থেকে এসেছে, এখানে আরও দেখুন )। সাধারণভাবে:

• শ্যাডো ডোম - আপনার উপাদানটির একটি অভ্যন্তরীণ ডোম যা আপনার দ্বারা সংজ্ঞায়িত করা হয় ( উপাদানটির স্রষ্টা হিসাবে) এবং শেষ ব্যবহারকারী থেকে গোপন। উদাহরণ স্বরূপ:

@Component({
  selector: 'some-component',
  template: `
    <h1>I am Shadow DOM!</h1>
    <h2>Nice to meet you :)</h2>
    <ng-content></ng-content>
  `;
})
class SomeComponent { /* ... */ }

• হালকা ডোম - এমন একটি ডোম যা আপনার উপাদানটির শেষ ব্যবহারকারী আপনার উপাদানগুলিতে সরবরাহ করে। উদাহরণ স্বরূপ:

@Component({
  selector: 'another-component',
  directives: [SomeComponent],
  template: `
    <some-component>
      <h1>Hi! I am Light DOM!</h1>
      <h2>So happy to see you!</h2>
    </some-component>
  `
})
class AnotherComponent { /* ... */ }

সুতরাং, আপনার প্রশ্নের উত্তর বেশ সহজ:

@ViewChildrenএবং এর মধ্যে পার্থক্য @ContentChildrenহ'ল হালকা DOM @ViewChildrenএ শ্যাডো ডিওমের উপাদানগুলির @ContentChildrenসন্ধান করুন।

Comments

মিনকো গেচে ব্লগ এন্ট্রি ব্লগ.মিগভেভ ডটকম / ২০১/0 / ২০১৩ / ২৩/২০ আমার কাছে আরও বোধগম্য। @ কনটেন্টচিল্ডেন হ'ল কন্টেন্ট প্রজেকশন (ng <ng- কনটেন্ট> </ লং- কনটেন্টের মধ্যে থাকা শিশু) byোকানো বাচ্চারা। মিনকোস ব্লগ থেকে: "অন্যদিকে, ** যে উপাদানগুলি প্রদত্ত উপাদানটির হোস্ট উপাদানটির খোলার এবং সমাপনী ট্যাগগুলির মধ্যে ব্যবহৃত হয় তাদের * বিষয়বস্তু শিশু ** বলা হয়।" অ্যাঙ্গুলার 2 এ শেডো ডিওএম এবং দেখুন এনক্যাপসুলেশনটি এখানে বর্জন করা হয়েছে: blog.thoughtram.io/angular/2015/06/29/… ।

— ওয়েস্টনর

আমার কাছে মনে হচ্ছে @TemplateChildren(এর পরিবর্তে @ViewChildren) বা @HostChildren(পরিবর্তে @ContentChildren) এর চেয়ে আরও ভাল নাম হওয়া উচিত, যেমন যেমন একটি প্রসঙ্গে আমরা যে বিষয়টির কথা বলছি তা দর্শন-সম্পর্কিত এবং আর্ট বাইন্ডিং বিষয়বস্তু সম্পর্কিতও।

— সুপারজোজ

@ViewChildren== আপনার নিজের সন্তান; @ContentChildren==

— কারওর

Answer 2

নামটি যেমন বোঝায়, @ContentChildএবং @ContentChildrenঅনুসন্ধানগুলি <ng-content></ng-content>আপনার দর্শনের উপাদানটির ভিতরে বিদ্যমান দিকনির্দেশগুলি ফিরিয়ে দেবে , @ViewChildএবং @ViewChildrenকেবলমাত্র আপনার ভিউ টেম্পলেটে থাকা উপাদানগুলিতে সরাসরি তাকান।

Comments

সুতরাং @ ভিউচিল্ড (রেন) ব্যবহার করুন যদি না আপনার দৃষ্টিতে উপাদান থাকে তবে এই ক্ষেত্রে @ কনটেন্টচিল্ড (রেন) এ পড়ে যান?

— বেন টালিডিয়োরোস

Answer 3

অ্যাঙ্গুলার কানেক্টের এই ভিডিওতে ভিউচিল্ডেন, ভিউচিল্ড, কন্টেন্টচিল্ডেন এবং কন্টেন্টচিল্ড সম্পর্কে দুর্দান্ত তথ্য রয়েছে https://youtu.be/4YmnbGoh49U

@Component({
  template: `
    <my-widget>
      <comp-a/>
    </my-widget>
`
})
class App {}

@Component({
  selector: 'my-widget',
  template: `<comp-b/>`
})
class MyWidget {}

থেকে my-widgetএর দৃষ্টিকোণ, comp-aহয় ContentChildএবং comp-bহয় ViewChild। CompomentChildrenএবং ViewChildrenএক্সচিল্ড একক দৃষ্টিতে ফিরে আসার সময় পুনরাবৃত্ত হবে return

Comments

এটি আরও ভাল ব্যাখ্যা। ধন্যবাদ :)

— জাভেদ

আপনি একটি পরিষ্কার এবং সহজ উদাহরণ তৈরি করেছেন, তবে মাই উইজেটের টেমপ্লেটটি <comp-b><ng-content></ng-content></comp-b>সঠিক হওয়া উচিত ?

— আরজেল

Answer 4

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

<home>
     <child>
           <small-child><small-child>
     </child>
</home>

এখন আপনি @ ভিউ শিশুদের সাথে বাড়ির উপাদানগুলির প্রসঙ্গে সমস্ত বাচ্চাদের উপাদানগুলি ধরে নিতে পারেন কারণ এগুলি সরাসরি ঘরের উপাদানগুলির টেম্পলেটে যুক্ত হয়। তবে, যখন আপনি <small-child>সন্তানের উপাদানগুলির প্রসঙ্গ থেকে উপাদানটি অ্যাক্সেস করার চেষ্টা করেন তখন আপনি এটিকে অ্যাক্সেস করতে পারবেন না কারণ এটি সরাসরি চাইল্ড উপাদানগুলির টেম্পলেটের মধ্যে যুক্ত হয় না। এটি বাড়ির উপাদান অনুসারে সামগ্রী উপাদানগুলিতে সামগ্রী সংযোজনের মাধ্যমে যুক্ত করা হয়। এখানেই @ কনটেন্টচিল্ড আসে এবং আপনি এটি @ কনটেন্টচিল্ড দিয়ে দখল করতে পারেন।

যখন আপনি নিয়ামকটিতে উপাদানগুলির রেফারেন্স অ্যাক্সেস করার চেষ্টা করেন তখন পার্থক্য দেখা দেয়। @ ভিউচিল্ড দ্বারা উপাদানগুলির টেম্পলেটে সরাসরি যুক্ত হওয়া সমস্ত উপাদানকে আপনি অ্যাক্সেস করতে পারবেন। তবে আপনি @ ভিউচিল্ডের সাথে অনুমানযুক্ত উপাদানগুলির রেফারেন্সটি ধরে নিতে পারবেন না অনুমানিত উপাদানটি অ্যাক্সেস করতে আপনাকে @ কনটেন্টচিল্ড ব্যবহার করতে হবে।