प्रश्न 1. इस कंपोनेंट क्लास में ViewChild डेकोरेटर का क्या उद्देश्य है?

@Component({
    ...
    template: '<p #bio></p>'
})
export class UserDetailsComponent {
    @ViewChild('bio') bio;
}

• यह कंपोनेंट क्लास के भीतर <p> टैग के ElementRef ऑब्जेक्ट तक पहुंच प्रदान करता है, जो कंपोनेंट के टेम्पलेट व्यू में बायो टेम्पलेट संदर्भ चरित्रित करता है।
• यह इस संबंधित कंपोनेंट का पैरेंट व्यू के रूप में <p> टैग का चाइल्ड रूप में लोड होने का संकेत देता है।
• यह टेम्पलेट में <p> टैग को सामग्री प्रोजेक्शन का समर्थन करता है।
• यह अंतिम रेंडर में <p> टैग को दृश्यमान बनाता है। यदि टेम्पलेट में #bio का उपयोग किया गया था और क्लास में @ViewChild का उपयोग नहीं किया गया था, तो Angular आवंटित किया गया #bio वाले <p> टैग को स्वचालित रूप से छुपा देता।

DigitalOcean - viewchild-access-component

प्रश्न 2. रिएक्टिव फ़ॉर्म में एक FormControl को प्राकृतिक DOM इनपुट तत्व से कैसे जोड़ा जाता है?

• फ़ॉर्म तत्व को दिए गए स्ट्रिंग नाम को <form> तत्व पर एट्रिब्यूट controls में जोड़ें ताकि यह इसमें शामिल करने वाली फ़ील्ड्स को इंडिकेट कर सके।
• DOM तत्व पर value एट्रिब्यूट के चारों ओर स्क्वायर ब्रैकेट बाइंडिंग सिंटैक्स का उपयोग करें और इसे एक FormControl के उदाहरण के समान सेट करें।
• formControlName निर्देशिका का उपयोग करें और उसे FormControl के दिए गए स्ट्रिंग नाम के समान सेट करें।
• FormControl के दिए गए स्ट्रिंग नाम का उपयोग DOM तत्व id एट्रिब्यूट के मान के रूप में करने के लिए।

Angular.io - Reactive Form Groups

प्रश्न 3. ActivatedRoute क्लास पर paramMap और queryParamMap का क्या अंतर है?

• paramMap एक मार्ग के URL पथ में पैरामीटरों का ऑब्जेक्ट लिटरल है। queryParamMap इन समान पैरामीटरों का एक Observable है।
• paramMap एक Observable है जो मार्ग के URL पथ में शामिल पैरामीटर मानों को शामिल करता है। queryParamMap एक विधि है जो एक कुंजीयों की एक श्रृंखला लेता है और paramMap में विशेष पैरामीटरों को खोजने के लिए प्रयोग किया जाता है।
• paramMap Angular 3 से विरासत में नाम है। नया नाम queryParamMap है।
• दोनों मार्ग के URL स्ट्रिंग से मांगे गए मानों को शामिल करने वाले ओब्जेक्ट होते हैं। paramMap मार्ग के URL पथ में पैरामीटर मानों को शामिल करता है और queryParamMap URL क्वेरी पैरामीटर्स को शामिल करता है।

StackOverflow

प्रश्न 4. निम्नलिखित async पाइप के उपयोग का ध्यान देते हुए, और मानते हुए कि उपयोक्ता क्लास क्षेत्र users एक Observable है, तो users Observable के लिए कितने सब्सक्रिप्शन हो रहे हैं?

<h2>Names</h2>
<div *ngFor="let user of users | async">{{ user.name }}</div>
<h2>Ages</h2>
<div *ngFor="let user of users | async">{{ user.age }}</div>
<h2>Genders</h2>
<div *ngFor="let user of users | async">{{ user.gender }}</div>

• कोई नहीं। एसिंक पाइप स्वचालित रूप से सब्सक्राइब नहीं करता है।
• कोई नहीं। टेम्पलेट सिंटैक्स सही नहीं है।
• तीन। प्रत्येक एसिंक पाइप के लिए एक होता है।
• एक। एसिंक पाइप टाइप के आंतरिक रूप से ओब्जेक्ट्स को कैश करता है।

UltimateCourses

प्रश्न 5. इस OrderService के एडऑर फ़ंक्शन के भीतर HttpClient का उपयोग करके एक एंडपॉइंट को POST अनुरोध कैसे भेजा जाए?

export class OrderService {
  constructor(private httpClient: HttpClient) {}

  addOrder(order: Order) {
    // Missing line
  }
}

• this.httpClient.url(this.orderUrl).post(order);
• this.httpClient.send(this.orderUrl, order);
• this.httpClient.post<Order>(this.orderUrl, order);
• this.httpClient.post<Order>(this.orderUrl, order).subscribe();

Angular.io - Sending data to server

प्रश्न 6. RouterModule.forRoot विधि का क्या उपयोग है?

• पंजीकरण किसी भी प्रदाताओं को जो आप रूट किए गए घटकों में प्रयोग करने की इच्छा रखते हैं।
• मूल अनुप्रयोग स्तर पर मार्ग परिभाषण पंजीकृत करना।
• इसका संकेत देना कि एंगुलर को आपके मार्ग सफल होने की शुभकामनाएँ देनी चाहिए।
• यह घोषणा करना कि आपको केवल मूल स्तर पर ही रूट की स्थिति का उपयोग करने की इच्छा है।

O'REILLY

प्रश्न 7. इस कंपोनेंट मेटाडेटा सेलेक्टर किस DOM तत्वों के साथ मेल खाएगा?

@Component({
    selector: 'app-user-card',
    . . .
})

• किसी भी एलिमेंट जिसमें एट्रिब्यूट app-user-card है, जैसे <div app-user-card></div>।
• <app-user-card></app-user-card> का पहला उदाहरण।
• <app-user-card></app-user-card> के सभी उदाहरण।
• <user-card></user-card> के सभी उदाहरण।

Angular.io - Component Metadata

प्रश्न 8. उत्पादनात्मक दिशा-निर्देशिका का उपयोग करने के लिए सही टेम्पलेट सिंटैक्स क्या है, जिसका उपयोग करके उत्पादनात्मक दिशा-निर्देशिका के बाहर उत्पादनात्मक दिशा की सूची को रेंडर किया जा सकता है?

• %OPTION% A

  <ul>
    <li [ngFor]="let productName of productNames">{{ productName }}</li>
  </ul>
  

• %OPTION% B

  <ul>
    <li ngFor="let productName of productNames">{{ productName }}</li>
  </ul>
  

• %OPTION% C

  <ul>
    <li *ngFor="let productName of productNames">{{ productName }}</li>
  </ul>
  

• %OPTION% D

  <ul>
    <? for productName in productNames { ?>
    <li>{{ productName }}</li>
    <? } ?>
  </ul>
  

Angular.io- Structural Directives

प्रश्न 9. किसे-किसे विभाजन डेकोरेटर मेटाडेटा गुण सेट करने के लिए उपयोग किया जाता है?

• viewEncapsulation और viewEncapsulationFiles।
• एकमात्र यहाँ एक है और वह है css गुण।
• css और cssUrl।
• शैलियाँ और styleUrls।

Angular.io - Component Styles

प्रश्न 10. निम्नलिखित कंपोनेंट क्लास के साथ, आप शीर्षक क्लास फ़ील्ड के मान को टेम्पलेट में किस टेम्पलेट सिंटैक्स का उपयोग करेंगे?

@Component({
  selector: 'app-title-card',
  template: '',
})
class TitleCardComponent {
  title = 'User Data';
}

• {{ 'title' }}
• {{ title }}
• [title]
• टेम्पलेट सिंटैक्स में एक क्लास फ़ील्ड को टेम्पलेट के माध्यम से प्रदर्शित किया नहीं जा सकता है।

Angular.io - String Interpolation or Text Interpolation

प्रश्न 11. एक FormControl पर valueChanges विधि का उपयोग क्या है?

• इसका उपयोग यह किया जाता है कि नियंत्रण के लिए कौने अनुमत होते हैं का विन्यास करने के लिए।
• इसका उपयोग नियंत्रण के मान को एक नए मान में बदलने के लिए होता है। आप उस विधि को कॉल करेंगे और फ़ॉर्म फ़ील्ड के लिए नए मान को पास करेंगे। यह यहाँ तक समर्थन प्रदान करता है कि कई मानों को समय-समय पर सेट किया जा सकता है।
• यह नियंत्रण के मान के मूल मान से अलग होने के आधार पर एक बूलियन वापस करता है।
• यह एक Observable है जो हर बार नियंत्रण के मान में परिवर्तन होने पर निर्वाचित होता है, ताकि आप नए मानों का प्रतिक्रिया कर सकें और उस समय नियोजन निर्णय कर सकें।

Angular.io - Displaying a from control value

प्रश्न 12. इस कंपोनेंट क्लास में Output डेकोरेटर का क्या उपयोग है?

• यह आइटम टोटल चेंज़ड क्लास फ़ील्ड को सार्वजनिक बनाता है।
• यह itemTotalChanged क्लास फ़ील्ड को बाइंड करने का एक तरीका प्रदान करता है, जैसे: <app-shopping-cart [itemTotalChanged]="newTotal"></app-shopping-cart>।
• यह itemTotalChanged क्लास फ़ील्ड के साथ इवेंट्स को बाइंड करने का एक तरीका प्रदान करता है, जैसे: <app-shopping-cart (itemTotalChanged)="logNewTotal($event)"></app-shopping-cart>।
• यह बस एक कमेंट को डेकोरेटर फ़ील्ड के सामने रखने का एक तरीका है।

Angular.io - Sending data to parent component

प्रश्न 13. इन दोनों मार्कअप उदाहरणों के बीच डिफ़रेंस क्या है विलोमतः प्रदर्शन को संदर्भात्मक रूप से संभालने के लिए?

@Component({
    selector: 'app-shopping-cart',
    . . .
})
export class ShoppingCartComponent {
    @Output() itemTotalChanged = new EventEmitter();
}

• ngIf दूसरे उदाहरण के लिए शॉर्टहैंड है। जब एंगुलर उस निर्देशिका को प्रसंस्करण करता है, तो वह DOM में एक div तत्व लिखता है जिसमें छिपा हुआ गुण होता है।
• वे मौलिक रूप से एक समान हैं।
• ngIf निर्देशिका यदि अभिव्यक्ति गलत होती है तो डिव DOM में नहीं रेंडर करती है। hidden गुण का उपयोग डिव सामग्री को ब्राउज़र व्यूपोर्ट में छिपाने के लिए करता है, लेकिन डिव अभी भी DOM में होता है।
• ngIf वैध है, लेकिन hidden गुण का उपयोग गलत है और त्रुटि उत्पन्न करेगा।

StackOverflow

सवाल 14. इन दो धाराओं के बीच शर्तानुसार प्रदर्शन का अंतर क्या है?

<div *ngIf="isVisible">Active</div>
<div [hidden]="!isVisible">Active</div>

• ngIf दूसरे उदाहरण के लिए संक्षेप है। जब Angular उस निर्देशिका को प्रसंस्करण करता है, तो वह एक div तत्व DOM में hidden संपत्ति के साथ लिखता है।
• वे मौलिक रूप से एक समान हैं।
• ngIf निर्देशिका अगर अभिव्यक्ति अगर गलत है तो डोम में div को नहीं प्रस्तुत करती है। hidden संपत्ति का उपयोग ब्राउज़र व्यूपोर्ट में div सामग्री को छिपाता है, लेकिन div DOM में फिर भी होता है।
• ngIf मान्य है, लेकिन hidden संपत्ति का उपयोग गलत है और यह त्रुटि फेंकेगा।

StackOverflow

सवाल 15. इस टेम्पलेट-संचालित फ़ॉर्म के उदाहरण में फ़ॉर्म में त्रुटियाँ होने पर सबमिट बटन को कैसे अक्षम किया जाए?

<form #userForm="ngForm">
  <input type="text" ngModel name="firstName" required />
  <input type="text" ngModel name="lastName" required />
  <button (click)="submit(userForm.value)">Save</button>
</form>

• %OPTION% A

  <button (click)="submit(userForm.value)" disable="userForm.invalid">Save</button>
  

• %OPTION% B

  <button (click)="submit(userForm.value)" [disabled]="userForm.invalid">Save</button>
  

• %OPTION% C

  <button (click)="submit(userForm.value)" [ngForm.disabled]="userForm.valid">Save</button>
  

• %OPTION% D

  <button (click)="submit(userForm.value)" *ngIf="userForm.valid">Save</button>
  

Angular.io - ngSubmit के साथ फ़ॉर्म सबमिट करें

सवाल 16. आप एक नए संपर्क-कार्ड संघटित करके कौन से फ़ाइलें उत्पन्न होंगी, उन्हें देखना चाहते हैं। आप कौन सा कमांड प्रयोग करेंगे?

• ng generate component contact-card --dry-run
• ng generate component contact-card --no-files
• ng generate component component --dry
• ng generate component --exclude

Angular.io - ng उत्पन्न विकल्प

सवाल 17. निम्नलिखित संपोषण के आधार पर, TitleCardComponent के titleText फ़ील्ड को h1 तत्व शीर्षक गुण से कैसे बाँधेंगे?

@Component({
  selector: 'app-title-card',
  template: '<h1 title="User Data"> {{titleText}}</h1>',
})
export class TitleCardComponent {
  titleText = 'User Data';
}

• <h1 data-title="titleText">{{ titleText }}</h1>
• <h1 title="titleText">{{ titleText }}</h1>
• <h1 [title]="titleText">{{ titleText }}</h1>
• <h1 titleText>{{ titleText }}</h1>

Angular.io - स्ट्रिंग इंटरपोलेशन

सवाल 18. Angular लाइफसाइकल हुक्स क्या हैं?

• Angular ऐप की स्वास्थ्य को ट्रैक करने के लिए लॉगर
• प्रोवाइडर जो किरणों के उदाहरणों को ट्रैक करने के लिए प्रयोग किया जा सकता है
• टेम्पलेट्स के लिए उपयुक्त विमान घटनाओं के लिए निर्मित पाइप्स
• Angular द्वारा निश्चित समयों पर कॉल किए जाने वाले कम्पोनेंट और निर्देशिकाओं के लिए आरक्षित नामित विधियों, और उन जीवनशैली पलों में प्रवेश करने के लिए उपयोग किया जा सकता है

Angular.io - लाइफसाइकल हुक्स

सवाल 19. इस टेम्पलेट की संटेंट के लिए सर्वोत्तम विवरण का चयन करें:

<span>Boss: {{job?.bossName}} </span>

• ? आसंकेत पाइप के लिए संक्षेप है। नौकरी मूल्य एक अवलोकनीय होना चाहिए।
• यह नौकरी क्षेत्र पर सुरक्षित नेविगेशन ऑपरेटर (?) का उपयोग कर रहा है। यदि नौकरी क्षेत्र अनिर्धारित है, तो बॉस नाम का उपयोग अनदेखा किया जाएगा और कोई त्रुटि नहीं होगी।
• टेम्पलेट की वाक्य-रचना में एक त्रुटि है। ? यहाँ मान्य नहीं है।
• यह नौकरी मूल्य को प्रदर्शित कर रहा है अगर उसका एक हो; अन्यथा यह बॉस नाम को प्रदर्शित कर रहा है।

StackOverflow

सवाल 20. एक UserDetailComponent के लिए एक मार्ग परिभाषण कैसे कॉन्फ़िगर करें जो URL मार्ग user/23 का समर्थन करता है (जहां 23 अनुरोधित उपयोगकर्ता की id को दर्शाता है)?

• { path: 'user/:id', component: UserDetailComponent }
• { url: 'user/:id', routedComponent: UserDetailComponent }
• { routedPath: 'user/:id', component: UserDetailComponent }
• { destination: new UserDetailComponent(), route: 'user/:id' }

CodeCraft - पैरामीटरीकृत मार्ग