राउटर के चारों ओर मजबूती से टाइप किया गया आवरण। एनवेट - कोणीय, कोणीय 2-रूटिंग

मैं डॉन 'टी का उपयोग कर की तरह router.navigate क्योंकि यह सभी अनुप्रयोग पर जादुई स्ट्रिंग का उपयोग करने की आवश्यकता है

this.router.navigate(["/user", user.id]);

इसलिए मैं इसके चारों ओर दृढ़ता से टाइप किए गए आवरण बनाना चाहता हूं:

export class NavigatorService {

constructor(private router: Router) {}

public user(userId: number): Promise<boolean> {
return this.router.navigate(["/user", user.id]);
}
}

बेशक इसे रूटिंग कॉन्फ़िगरेशन के साथ सिंक में रखा जाना चाहिए।

मुझे क्या परेशान करता है

<a [routerLink]="["/user", user.id]">
</a>

क्या मुझे अतिरिक्त तरीका जोड़ना चाहिए जो सरणी लौटाता है?

export class NavigatorService {

...

public userArr(userId: number): Array<any> {
return ["/user", user.id];
}
}

<a [routerLink]="navigator.userArr(user.id)">
</a>

कोई विचार? क्या कोई पहले से ही इस सड़क से नीचे जा सकता है?

उत्तर:

जवाब के लिए 0 № 1

आप बस अपना रिवाज बना सकते हैं routerLink निर्देश जो आपकी सेवा को इंजेक्ट करता है और इसका उपयोग करने के लिए सक्षम होने के लिए लिंक उत्पन्न करने के लिए इसका उपयोग करता है

[myRouterLink]="32"

https://github.com/angular/angular/blob/a006c1418a9f4d44f4046976c0ee2824416aa096/modules/%40angular/router/src/directives/router_link.ts#L82-L128

---

जवाब के लिए 0 № 2

कुछ सोच के बाद मैंने फैसला किया कि साधारण मार्ग के लिए मुझे अगला सेवा हस्ताक्षर चाहिए:

class NavigatorService {
user(id: number, matrix: MatrixParams = {}): Navigation { ... }
}

कहा पे MatrixParams एक साधारण वस्तु है

interface MatrixParams {
[index: string]: any
}

तथा Navigation विस्तारित सरणी है:

interface Navigation extends Array<any> {
go(extras?: NavigationExtras): Promise<boolean>;
}

Navigation दोनों कोड और में इस्तेमाल किया जा सकता है routerLink निर्देश:

    this.navigator.user(1).go();

    <a [routerLink]="navigator.user(1)">...</a>

इस तरह की वस्तु बनाने के लिए मैंने "सरणी उपवर्ग का उपयोग किया है जैसा कि यह वर्णित है यहाँ:

function navigation(router: Router, ...items: any[]): Navigation {
let arr: Navigation = <Navigation>[...items];

arr.go = (extras?: NavigationExtras): Promise<boolean> => {
return router.navigate(arr, extras);
};

return arr;
}

तो सेवा कार्यान्वयन होगा:

class NavigatorService {
constructor(private router: Router) { }

user(id: number, matrix: MatrixParams = {}): Navigation {
return navigation(this.router, "/user", id, matrix);
}
}

अधिक जटिल मार्गों के लिए नेविगेशन के अतिरिक्त उपवर्गों का उपयोग किया जा सकता है:

class NavigatorService {
...

order(id: number, matrix: MatrixParams = {}): OrderNavigation {
return orderNavigation(this.router, "/order", id, matrix);
}
}

interface OrderNavigation extends Navigation {
items(matrix?: MatrixParams): Navigation;
}

function orderNavigation(router: Router, ...items: any[]): OrderNavigation {
let arr: OrderNavigation = <OrderNavigation>navigation(router, ...items);

arr.items = (matrix: MatrixParams = {}): Navigation => {
return navigation(router, ...arr, "items", matrix);
};

return arr;
}

---