কৌনিক 8 এ @ ভিভিচিল্ডের জন্য আমার নতুন স্থিতিশীল বিকল্পটি কীভাবে ব্যবহার করা উচিত?

Question

নতুন অ্যাংুলার 8 ভিউ চাইল্ডটি কীভাবে কনফিগার করব?

@ViewChild('searchText', {read: ElementRef, static: false})
public searchTextInput: ElementRef;

বনাম

@ViewChild('searchText', {read: ElementRef, static: true})
public searchTextInput: ElementRef;

কোনটা ভাল? আমি কখন static:trueবনাম ব্যবহার করা উচিত static:false?

Answer 1

বেশিরভাগ ক্ষেত্রে আপনি ব্যবহার করতে চাইবেন {static: false}। এটিকে সেট করে নেওয়ার ফলে বেইন্ডিং রেজোলিউশনের উপর নির্ভরশীল কোয়েরি মিলগুলি (কাঠামোগত নির্দেশাবলীর মতো *ngIf, etc...) সন্ধান করা হবে।

কখন ব্যবহার করবেন তার উদাহরণ static: false:

@Component({
  template: `
    <div *ngIf="showMe" #viewMe>Am I here?</div>
    <button (click)="showMe = !showMe"></button>
  ` 
})
export class ExampleComponent {
  @ViewChild('viewMe', { static: false })
  viewMe?: ElementRef<HTMLElement>; 

  showMe = false;
}

static: falseআরো কৌণিক 9. পড়ুন ডিফল্ট ফলব্যাক আচরণের হতে যাচ্ছে এখানে এবং এখানে

{ static: true }বিকল্প মাছি এম্বেড মতামত তৈরি সমর্থন করার জন্য চালু করা হয়। আপনি যখন গতিশীলভাবে একটি ভিউ তৈরি করছেন এবং অ্যাক্সেস করতে চান TemplateRef, আপনি এটি করতে সক্ষম হবেন না ngAfterViewInitকারণ এটি ExpressionHasChangedAfterCheckedত্রুটির কারণ হবে । স্থির পতাকাটিকে সত্যে সেট করা এনজিওনিটিতে আপনার দৃষ্টিভঙ্গি তৈরি করবে।

তা সত্ত্বেও:

অন্যান্য ক্ষেত্রে, সবচেয়ে ভাল অনুশীলনটি ব্যবহার করা {static: false}।

{ static: false }বিকল্পটি কৌণিক 9 এ ডিফল্ট করা হবে যদিও সচেতন হন । যার অর্থ আপনি static: trueবিকল্পটি ব্যবহার করতে না চাইলে স্থির পতাকা স্থাপনের আর প্রয়োজন হয় না ।

আপনি ng updateআপনার বর্তমান কোড বেসটি স্বয়ংক্রিয়ভাবে আপগ্রেড করতে কৌণিক ক্লাইম কমান্ডটি ব্যবহার করতে পারেন ।

মাইগ্রেশন গাইড এবং এ সম্পর্কিত আরও তথ্যের জন্য আপনি এখানে এবং এখানে চেক করতে পারেন

স্থির এবং গতিশীল প্রশ্নের মধ্যে পার্থক্য কী?

@ ভিউচিল্ড () এবং @ কনটেন্টচিল্ড () প্রশ্নের জন্য স্থিতিশীল বিকল্প কোয়েরির ফলাফল কখন উপলভ্য হবে তা নির্ধারণ করে।

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

ডায়নামিক ক্যোয়ারী (স্থির: মিথ্যা) এর সাথে, কোয়েরিটি @ ভিউচিল্ড () এবং @ কনটেন্টচিল্ড () এর জন্য যথাক্রমে এনজিএফটারভিউআইনিট () বা এনজিএফটারকন্টেন্টআইনিট () এর পরে সমাধান হয়েছে। আপনার ভিউতে পরিবর্তনের জন্য ফলাফল আপডেট করা হবে, যেমন এনজিআইএফ এবং এনজিফোর্ড ব্লকগুলিতে পরিবর্তন।

Comments

অনুগ্রহ করে কৌণিক ডক্সের জন্য লিঙ্কটি আপডেট করুন (মুক্তির পরে পরিবর্তিত হয়েছে) কৌণিক.ইও

— শচীন গুপ্ত

আমি চাইল্ডভিউয়ের দৃষ্টান্তটি অ্যাক্সেস করতে পারছি না। এটি সব সময় অপরিজ্ঞাত বলে।

— নেছান মানো

আপনি দয়া করে কৌণিক 9 এ স্থিতিশীল বিকল্পটি অপসারণ সম্পর্কিত সেই তথ্য সম্পর্কে একটি লিঙ্ক সরবরাহ করতে পারেন?

— অ্যালেক্স মেরিনভ

@ অ্যালেক্সমারিনভ আমি আমার উত্তরটি আপডেট করেছি যে এটি কৌণিক 9 তে কী ঘটবে তা আরও স্পষ্ট করে তুলতে এই লিঙ্কটি মাইগ্রেশন গাইডের মধ্যে রয়েছে

— পৌল ক্রুইজট

@ মিনহিগিয়া যদি আপনি উপাদানটির টেমপ্লেটের বাইরে পুরো উপাদানটি বাসা বাঁধেন তবে আপনি ব্যবহার করতে পারেন { static: true }তবে যদি ভিউচিল্ডের ভিতরে প্রবেশের সরাসরি কোনও প্রয়োজন না থাকে তবে ngOnInitআপনার কেবলমাত্র এটি ব্যবহার করা উচিত { static: false }।

— পল ক্রুইজ্ট

Answer 2

সুতরাং থাম্বের নিয়ম হিসাবে আপনি নিম্নলিখিতগুলি যেতে পারেন:

• { static: true }যখন আপনি অ্যাক্সেস করতে চান চাহিদা সেট হওয়ার ViewChildমধ্যে ngOnInit।

• { static: false }শুধুমাত্র অ্যাক্সেস করা যেতে পারে ngAfterViewInit। আপনি যখন *ngIfআপনার টেম্পলেটটিতে আপনার উপাদানের কাঠামোগত দিকনির্দেশনা (ie ) রাখেন তখন আপনি যা করতে চান তাও এটি ।

Comments

দ্রষ্টব্য: কৌণিক 9 এ, স্থিতিশীল পতাকাটি মিথ্যাতে ডিফল্ট হয়, সুতরাং "যে কোনও {স্থিতিশীল: মিথ্যা safely পতাকাগুলি নিরাপদে সরানো যেতে পারে"। ডকুমেন্টেশন: angular.io/guide/static-query-migration

— Stevethemacguy

Answer 3

কৌণিক ডক্স থেকে

স্থিতিশীল - পরিবর্তন সনাক্তকরণ চলার আগে ক্যোয়ারির ফলাফলগুলি সমাধান করতে হবে কি না (যেমন কেবল স্থির ফলাফলগুলি ফেরত পাওয়া যায়)। যদি এই বিকল্পটি সরবরাহ না করা হয়, তবে সংকলকটি তার ডিফল্ট আচরণে ফিরে যাবে, যা কোয়েরি রেজোলিউশনের সময় নির্ধারণের জন্য ক্যোয়ারির ফলাফলগুলি ব্যবহার করতে হবে। যদি কোনও প্রশ্নের ফলাফল নেস্টেড ভিউয়ের মধ্যে থাকে (উদাঃ * এনজিআইফ), পরিবর্তন সনাক্তকরণ চলার পরে কোয়েরিটি সমাধান করা হবে। অন্যথায়, পরিবর্তন সনাক্তকরণ চালানোর আগে এটি সমাধান করা হবে।

static:trueযদি শিশু কোনও অবস্থার উপর নির্ভর না করে তবে এটি ব্যবহার করা আরও ভাল ধারণা হতে পারে । যদি উপাদানটির দৃশ্যমানতা পরিবর্তন হয় তবে static:falseআরও ভাল ফলাফল দিতে পারে।

পিএস: এটির একটি নতুন বৈশিষ্ট্য হ'ল, আমাদের পারফরম্যান্সের জন্য বেঞ্চমার্ক চালানোর প্রয়োজন হতে পারে।

সম্পাদন করা

@ মাসিমিলিয়ানো সার্টোরেটো দ্বারা উল্লিখিত হিসাবে, গিথুব কমিট আপনাকে আরও অন্তর্দৃষ্টি দিতে পারে।

Comments

আমি এই বৈশিষ্ট্যের পিছনে সরকারী প্রেরণাগুলি যোগ করব github.com/angular/angular/pull/28810

— ম্যাসিমিলিয়ানো সার্টোরেটো

Answer 4

অ্যাঙ্গুলার 8 এ আপগ্রেড করার পরে একটি ভিউচিল্ড ngOnInit এ বাতিল হয়ে যাওয়ার কারণে এখানে এসেছিল।

স্ট্যাটিক ক্যোয়ারী এনজিওইনাইটের পূর্বে পূরণ করা হয়, যখন ডায়নামিক ক্যোয়ারী (স্থির: মিথ্যা) পরে পূরণ করা হয়। অন্য কথায়, যদি কোনও স্ট্যাচিক সেট করার পরে যদি কোনও ভিউচাইল্ড এখন ngOnInit এ শূন্য থাকে: মিথ্যা, আপনার স্ট্যাটিকের পরিবর্তনের কথা বিবেচনা করা উচিত: সত্য বা কোডটি এনজিএফটারভিউআইনিটিতে স্থানান্তরিত করা উচিত।

Https://github.com/angular/angular/blob/master/packages/core/src/view/view.ts#L332-L336 দেখুন

অন্যান্য উত্তরগুলি সঠিক এবং এটি কেন ব্যাখ্যা করা হয়েছে: কাঠামোগত নির্দেশাবলীর উপর নির্ভরশীল প্রশ্নাগুলি, যেমন কোনও এনজিআইএফের মধ্যে ভিউচিল্ড রেফারেন্স, এই নির্দেশিকার শর্তাধীন সমাধান হওয়ার পরে, অর্থাৎ পরিবর্তন সনাক্তকরণের পরে চালানো উচিত। তবে, কেউ নিরাপদে স্থিতিশীল ব্যবহার করতে পারে: সত্য এবং এইভাবে অনির্ধারিত উল্লেখগুলির জন্য এনজিওইনাইটের আগে প্রশ্নগুলি সমাধান করুন। ইমো এই বিশেষ ক্ষেত্রে নাল ব্যতিক্রম হিসাবে উল্লেখ করা সম্ভবত আপনি প্রথমত এই বৈশিষ্ট্যের মুখোমুখি হবেন, যেমনটি আমার পক্ষে ছিল।

Answer 5

শিশু @angular 5+ টোকেন দুটি আর্গুমেন্ট দেখুন ('স্থানীয় রেফারেন্স নাম', স্থির: মিথ্যা | সত্য)

@ViewChild('nameInput', { static: false }) nameInputRef: ElementRef;

সত্য এবং মিথ্যা পরীক্ষা করে দেখুন এই পার্থক্যটি জানতে

স্থিতিশীল - পরিবর্তন সনাক্তকরণ চলার আগে ক্যোয়ারির ফলাফলগুলি সমাধান করতে হবে কি না (যেমন কেবল স্থির ফলাফলগুলি ফেরত পাওয়া যায়)। যদি এই বিকল্পটি সরবরাহ না করা হয়, তবে সংকলকটি তার ডিফল্ট আচরণে ফিরে যাবে, যা কোয়েরি রেজোলিউশনের সময় নির্ধারণের জন্য ক্যোয়ারির ফলাফলগুলি ব্যবহার করতে হবে। যদি কোনও প্রশ্নের ফলাফল নেস্টেড ভিউয়ের মধ্যে থাকে (উদাঃ * এনজিআইফ), পরিবর্তন সনাক্তকরণ চলার পরে কোয়েরিটি সমাধান করা হবে। অন্যথায়, পরিবর্তন সনাক্তকরণ চালানোর আগে এটি সমাধান করা হবে।

Answer 6

এনজি 8-তে, যখন প্যারেন্ট উপাদানগুলিতে সন্তানের উপাদানটি অ্যাক্সেস করতে হয় তবে আপনি নিজে নিজে সেট করতে পারেন। আপনি যখন স্থিতিশীলকে সত্যে সেট করেন, তার অর্থ পিতামণ্ডল উপাদানটি কেবল onInitহুকের অংশের সংজ্ঞা পান : উদাহরণস্বরূপ:

 // You got a childComponent which has a ngIf/for tag
ngOnInit(){
  console.log(this.childComponent);
}

ngAfterViewInit(){
  console.log(this.childComponent);
}

যদি স্থিতিথেকে মিথ্যা হয়, তবে আপনি কেবল এনজিএফটারভিউইনিত (), এনজিওইননেট () এ সংজ্ঞা পাবেন, আপনি অপরিবর্তিত পাবেন।