Angular-এ রাউটিংয়ের জন্য লিঙ্ক

পূর্ববর্তী পাঠগুলিতে, আমরা নিজেরা হাতে URL ঠিকানা বারে লিখতাম। এবার আসুন লিঙ্ক তৈরি করি, যেগুলোতে ক্লিক করলে বিভিন্ন কম্পোনেন্ট দেখাবে।

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

সেইজন্য নেটিভ href অ্যাট্রিবিউটের পরিবর্তে আমরা Angular-এর RouterLink অ্যাট্রিবিউট ব্যবহার করব।

এটি করার জন্য আমাদের এটা ইম্পোর্ট করতে হবে:

import { RouterLink } from '@angular/router';

ডেকোরেটরে লিখতে হবে:

@Component({
	......
	imports: [RouterOutlet, RouterLink],
	......
})

এখন আমরা আমাদের লিঙ্কগুলি তৈরি করতে পারি:

<nav>
	<a routerLink="/aaaa/">
		Aaaa
	</a>
	<a routerLink="/bbbb/">
		Bbbb
	</a>
</nav>

আপনার কম্পোনেন্টগুলি পরিবর্তন করে এমন লিঙ্ক তৈরি করুন।