کونیی روٹنگ کی وضاحت ، URL کے راستے پر مبنی اجزاء پر کیسے جائیں

اپنے پچھلے مضمون میں ، میں نے Angular 2+ ورژن کے ساتھ بنیادی Angular درخواست بنانے کے اقدامات کی وضاحت کی ہے۔

یہاں میں اگلے مرحلے کی وضاحت کروں گا ، URL کے راستے پر مبنی مختلف جزو پر جانے کے لئے روٹنگ کو کیسے لکھنا ہے۔ غور کرنے سے آپ جانتے ہو کہ جزو اور ماڈیول کیا ہے۔ اگر آپ کو یہاں ماڈیول اور جزو کے تبصرے کے بارے میں کوئی شبہ ہے۔

روٹنگ کو نافذ کرنے کے لئے یہ اقدامات ہیں:

مرحلہ نمبر 1:

AppRoutingModule بنانے کے لئے کمانڈ کے نیچے چلائیں

این جی جی ماڈیول ایپ - روٹنگ

یہ نیچے دیئے گئے مواد والی ایپ روٹنگ۔موڈول ڈاٹ ٹی ایس فائل تشکیل دے گا۔

'@ کونیی / بنیادی' سے {این جی میڈول import درآمد کریں؛
'@ کونیی / روٹر' سے {روٹس ، راؤٹرموڈول import درآمد کریں؛
@ این جی میڈول (orts درآمدات: [روٹر موڈول۔فور چائلڈ (روٹس)] ، برآمدات: [راؤٹرموڈول]})
برآمد کلاس AppRoutingModule}

مرحلہ 2:

مذکورہ فائل کو راستوں کے ساتھ ترمیم کریں:

نقاط کے راستے: راستے = [{راستہ: 'گھر' ، جزو: HomeComp घटक}]

یہاں میں نے ٹائٹل روٹس کا مستقل تخلیق کیا ہے اور متعلقہ پاتھ اور جزو تفویض کیا ہے۔ اس طرح آپ متعدد راستہ متعلقہ جزو کے ساتھ منسلک کرسکتے ہیں۔ فائل میں ترمیم کرنے کے بعد یہ نیچے کی طرح نظر آئے گا:

'@ کونیی / بنیادی' سے {این جی میڈول import درآمد کریں؛
'@ کونیی / روٹر' سے {روٹس ، راؤٹرموڈول import درآمد کریں؛
نقاط کے راستے: راستے = [{راستہ: 'گھر' ، جزو: HomeComp घटक} ، {راستہ: 'لاگ ان' ، جزو: لاگ انکمپاؤنٹ}]
@ این جی میڈول (orts درآمدات: [روٹر موڈول۔فور چائلڈ (روٹس)] ، برآمدات: [راؤٹرموڈول]})
برآمد کلاس AppRoutingModule}

اب آپ اپنی ایپ ماڈیول فائل میں یہ ایپ روٹنگنگ موڈول نیچے کی طرح درآمد کرسکتے ہیں:

درآمدات: [
AppRoutingModule ،
]

اب آپ مجھ سے پوچھ سکتے ہیں کہ پہلے سے طے شدہ روٹنگ کی وضاحت کیسے کی جائے۔ پہلے سے طے شدہ راستہ بنانے کے ل you آپ کو نیچے کی طرح راستہ کی وضاحت کرنے کی ضرورت ہے۔

{راستہ: '' ، redirectTo: '/ home'، pathMatch: 'full'

نیچے کی طرح اس کو اندرونی راستوں میں شامل کریں:

راستہ: راستے = [
{راستہ: 'گھر' ، جزو: ہوم اجزاء} ،
{راستہ: '' ، redirectTo: '/ home'، pathMatch: 'full' '،
{راستہ: 'لاگ ان' ، جزو: لاگ انکم onent
]

آپ ذیل میں استعمال کرکے غلط URls کے لئے راستہ کی وضاحت کرسکتے ہیں:

{راستہ: '**'، redirectTo: '/ errorPage'، pathMatch: 'full'}

یہ مضمون میرے اگلے مضمون میں جاری ہے ، وہاں میں بچوں کے راستے بنانے کا طریقہ ، سست بوجھ پیدا کرنے کا طریقہ اور بہت کچھ بیان کروں گا۔