ค้นหาเว็บไซต์

angular - การเข้าถึงข้อมูลเส้นทางจาก directives ใน angular2


const APP_ROUTES: RouterConfig = [

    {

        path: 'app/home',
        component: HomeComponent,
        data: {
          name: 'Home'
        }

    }


]

ถ้าฉันมีการกำหนดค่าการนำทางดังที่แสดงด้านบน ฉันจะเข้าถึงคุณสมบัติ data ของมันจาก directive บางตัวได้อย่างไร

@Directive({
  name: 'hello'
})

class HelloDirective {
 @Input('routerLink') link: string[];

 ngOnInit() {
    //HOW CAN I GET ROUTE AND ITS DATA FROM PATH/URL ???

    //const magicallyGrabbedRoute = pleaseGiveMeMyRouteFrom(this.link);
    //const myData = magicallyGrabbedRoute.data;

 }

}

<a hello [routerLink]="['app/home']"> Go Home </a>

ในคำสั่ง hello ฉันจะสามารถดึงการกำหนดเส้นทางสำหรับค่าของแอตทริบิวต์ routerLink ได้อย่างไร?

คำตอบ #1

(RC6): คุณต้องนำเข้า:

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

จากนั้นในตัวสร้างของคุณ:

constructor(private route: ActivatedRoute) { }

คลาสควร implements OnInit แบบนี้:

ngOnInit() { const myData=this.route.snapshot.data['name']; }

นี่เป็นกรณีที่ URL ของคุณไม่ใช่แบบไดนามิก หากเป็นแบบไดนามิกคุณควรใช้ observer แทน snapshot ป.ล. สำหรับพ่อแม่ของพ่อแม่ให้ใช้เพียง: this.route.snapshot.parent.data['name']

คำตอบ #2

คุณสามารถสมัครรับข้อมูลเกี่ยวกับพารามิเตอร์เส้นทางโดยใส่มันภายในคลาส Component ของคุณ และมี private route: ActivatedRoute ใน constructor

this.sub = this.route
  .params //.data //--> use data to retrieve route data
  .subscribe(params => {
    console.log(params['id']);
  });

คุณยังสามารถใช้ this.route.snapshot.data เพื่อดึงข้อมูลที่ส่งผ่านในการกำหนดเส้นทางได้ด้วย

บทความที่เกี่ยวข้อง