কৌণিক 2 কেন নক্ষত্র (*)

Question

কৌণিক 2 নথিতে, * এবং টেমপ্লেটে , আমরা জানি যে * এনজিআইএফ, * এনজিউইচ, * এনজিফোর্ড এনজি-টেম্পলেট ট্যাগে প্রসারিত হতে পারে। আমার প্রশ্নটি হ'ল:

আমি মনে করি কৌনিক ইঞ্জিন দ্বারা টেমপ্লেট ট্যাগে ngIfবা ngForছাড়াও *অনুবাদ করা যায় এবং প্রসারিত করা যায়।

নিম্নলিখিত কোড

<hero-detail *ngIf="currentHero" [hero]="currentHero"></hero-detail>

হিসাবে একই হবে

<ng-template [ngIf]="currentHero">
  <hero-detail [hero]="currentHero"></hero-detail>
</ng-template>

তাহলে কেন *কৌণিক 2 তে একটি অদ্ভুত প্রতীক ( ) চিহ্নটি নকশা করা বিরক্ত করবেন ?

Comments

লিঙ্কটি থেকে, আমরা <template>ট্যাগগুলি দেখতে পেলাম না কারণ *উপসর্গের বাক্য গঠন আমাদের সেই ট্যাগগুলি এড়িয়ে যেতে এবং আমাদের অন্তর্ভুক্ত, বাদ দেওয়া বা পুনরাবৃত্তি করা এইচটিএমএল উপাদানটিতে সরাসরি ফোকাস করতে দেয়।

— তুষার

angular.io/docs/ts/latest/guide/...

— TGH

টেম্পলেট ট্যাগটি সরাসরি ব্যবহার করা আপনার পছন্দ, আপনি যে টেমপ্লেট ট্যাগের যত্ন নেন সেই * ব্যবহার করতে পারেন। - উত্স

— তুষার

Answer 1

অস্টেরিক সিনট্যাক্স হ'ল শব্দযুক্ত টেম্পলেট সিনট্যাক্সের জন্য একটি সিনট্যাটিক চিনি যা নির্দেশটি হুডের নীচে প্রসারিত হয়, আপনি এই বিকল্পগুলির কোনও ব্যবহার করতে নির্দ্বিধায়।

দস্তাবেজগুলি থেকে উদ্ধৃতি :

নক্ষত্রটি হ'ল "সিনট্যাকটিক চিনি"। এটি লেখক এবং পাঠক উভয়ের জন্য এনজিআইএফ এবং এনজিফোর্ডকে সহজতর করে। ফণা অধীনে, কৌণিক একটি আরও ভার্বোস ফর্ম সঙ্গে তারকাচিহ্ন সংস্করণ প্রতিস্থাপন।

পরবর্তী দুটি এনজিআই উদাহরণগুলি কার্যকরভাবে একই এবং আমরা উভয় শৈলীতে লিখতে পারি:

<!-- Examples (A) and (B) are the same -->

<!-- (A) *ngIf paragraph -->
<p *ngIf="condition">
  Our heroes are true!
</p>

<!-- (B) [ngIf] with template -->
<template [ngIf]="condition">
  <p>
    Our heroes are true!
  </p>
</template>

Comments

ডকুমেন্টটি এটাই বলে। আমার অর্থের ভুল বর্ণনার জন্য দুঃখিত, আমি প্রশ্নের বিশদটি পরিবর্তন করেছি।

— ম্যাক্সিসাকডার

আমি বলতে চাইছি কেন এই চিনিটি ডিজাইন করুন, কেবলমাত্র * ব্যবহার করে ডিফল্টরূপে কেন প্রসারিত করুন।

— ম্যাক্সিসাকডার

আমি ভাবার বিভিন্ন কারণ রয়েছে: 1. ngIf="expression"কোনও ইনপুট বাইন্ডিং নয়। আপনি যদি ডিওএম থেকে মান পান তবে এটি একটি স্ট্রিং হবে। ২. ফ্রেমওয়ার্কটি ngIfবিশেষ কেস সম্পর্কে এবং অন্যান্য বিষয়গুলি জানতে হবে । অবশ্যই, ডিডিও-তে কোথাও কোনও বুলিয়ান বৈশিষ্ট্য নির্দিষ্ট করা কার্যকর করবে তবে নিয়মিত বৈশিষ্ট্য এবং কাঠামোগত নির্দেশিকা চিনির মধ্যে পার্থক্য জানতে আপনাকে কোড / ডক্সে সন্ধান করতে হবে। ৩. স্কোয়ার বন্ধনী, aserisk, বন্ধনী এবং সেগুলির অভাব টেমপ্লেট রিডারে কী চলছে তা স্পষ্টভাবে প্রচার করে।

— ক্লাস্টার_1

এনজি 1-তে কোনও তারকাচিহ্ন ছাড়া এনজি-ইফ, এনজি-শো ইত্যাদি লিখতে কেন এটি কাজ করেছিল?

— রাবারডাক র্যাবিট

@ রাবারডাক রব্বিট কারণ এনজি 1 এর সম্পূর্ণ ভিন্ন বাঁধাই প্রয়োগ রয়েছে। এটি এনজি 2 + এর জন্য নতুনভাবে ডিজাইন করা হয়েছিল।

— ক্লাস্টার_15

Answer 2

Angular2 একটি বিশেষ ধরণের নির্দেশনা দেয় - কাঠামোগত দিকনির্দেশনা

কাঠামোগত নির্দেশাবলী <template>ট্যাগ ভিত্তিতে হয় ।

*অ্যাট্রিবিউট আগে নির্বাচক নির্দেশ করে যে একটি কাঠামোগত নির্দেশ একটি স্বাভাবিক বৈশিষ্ট্য নির্দেশ বা সম্পত্তি বাঁধাই পরিবর্তে প্রয়োগ করতে হবে। Angular2 অভ্যন্তরীণভাবে বাক্য বাক্যকে একটি সুস্পষ্ট <template>ট্যাগে প্রসারিত করে ।

চূড়ান্ত হওয়ার সাথে সাথে এমন <ng-container>উপাদানও রয়েছে যা <template>ট্যাগের মতো একইভাবে ব্যবহার করা যেতে পারে তবে আরও সাধারণ শর্ট হ্যান্ড সিনট্যাক্সকে সমর্থন করে। এটি উদাহরণস্বরূপ প্রয়োজনীয় যখন দুটি কাঠামোগত নির্দেশ কোনও একক উপাদানে প্রয়োগ করা উচিত, যা সমর্থিত নয়।

<ng-container *ngIf="boolValue">
  <div *ngFor="let x of y"></div>
</ng-container>

Answer 3

কৌণিক টেম্পলেট উপাদানগুলিকে একটি বিশেষ উপায়ে আচরণ করে। *সিনট্যাক্স একটি শর্টকাট আপনি পুরো লেখা বাতিলযোগ্য করতে দেয় <template>উপাদান। এটি কীভাবে কাজ করে তা আমাকে দেখাতে দিন।

এটি ব্যবহার করে

*ngFor="let t of todos; let i=index"

এটি ডি-সুগার

template="ngFor: let t of todos; let i=index" 

যা ডি-সুগার

<template ngFor [ngForOf]="todos" .... ></template>

এনজিফোর্ড, এনজিআইএফ ইত্যাদির মতো কৌণিকের স্ট্রাকচারাল দিকনির্দেশগুলি *কেবল এই কাস্টম নির্দেশাবলী এবং উপাদানগুলি থেকে পৃথক করার জন্য উপসর্গযুক্ত করা হয়েছে

আরও এখানে দেখুন

https://vsavkin.com/angular-2-template-syntax-5f2ee9f13c6a#.rcffirs7a

Answer 4

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

কাঠামোগত নির্দেশাবলী HTML লেআউটের জন্য দায়ী। তারা ডিওএমের কাঠামোটিকে আকার দেয় বা পুনরায় আকার দেয়, সাধারণত উপাদানগুলি যোগ করে, অপসারণ করে বা হেরফের করে।

অন্যান্য নির্দেশাবলীর মতো আপনিও কোনও হোস্ট উপাদানকে কাঠামোগত নির্দেশনা প্রয়োগ করেন । নির্দেশিকাটি তখন সেই হোস্ট উপাদান এবং এর বংশধরদের সাথে যা করা উচিত তা করে।

কাঠামোগত নির্দেশগুলি স্বীকৃতি দেওয়া সহজ। একটি তারকাচিহ্ন (*) এর উদাহরণ অনুসারে নির্দেশিক বৈশিষ্ট্যের নামের আগে।

<p *ngIf="userInput">{{username}}</p>

Answer 5

কখনও কখনও আপনার <a *ngIf="cond">উদাহরণের প্রয়োজন হতে পারে , যখন এটি কেবল একটি ট্যাগ। কখনও কখনও আপনি এনজিআইএফটিকে একটি মোড়ক হিসাবে সত্যিকারের ট্যাগ না দিয়ে একাধিক ট্যাগের চারপাশে রাখতে পারেন যা আপনাকে <template [ngIf]="cond">ট্যাগ করতে পরিচালিত করে । চূড়ান্ত ফলাফল এইচটিএমএল এ এনজিআইফের নির্দেশক মালিককে রেন্ডার করা উচিত কীভাবে কৌনিকটি জানতে পারে? সুতরাং এটি কোডটিকে আরও স্পষ্ট করার চেয়ে আরও বেশি কিছু। এটি একটি প্রয়োজনীয় পার্থক্য।