Thuta Learning
ရှာဖွေရန်
AdvancedWeb Developmentintermediate

Route Parameters

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

URL parameters များကို access လုပ်ပြီး dynamic routes များ တည်ဆောက်နိုင်သည်။

typescript
// app-routing.module.ts
const routes: Routes = [
  { path: 'user/:id', component: UserDetailComponent },
  { path: 'product/:id/:name', component: ProductComponent }
];

// user-detail.component.ts
import { ActivatedRoute } from '@angular/router';

export class UserDetailComponent implements OnInit {
  userId: string;
  
  constructor(private route: ActivatedRoute) {}
  
  ngOnInit() {
    // Method 1: Snapshot (one-time read)
    this.userId = this.route.snapshot.paramMap.get('id');
    
    // Method 2: Observable (reactive, updates when params change)
    this.route.paramMap.subscribe(params => {
      this.userId = params.get('id');
      this.loadUser(this.userId);
    });
  }
}

// Navigate programmatically
constructor(private router: Router) {}

goToUser(id: number) {
  this.router.navigate(['/user', id]);
}
You should see
(URL မှ parameters များကို read လုပ်ပြီး component တွင် အသုံးပြုနိုင်သည်)
Route Parameters | Thuta Learning