angular - [राऊटरलिंक] और राउटरलिंक के बीच अंतर




routes routerlink (2)

[routerLink] और routerLink क्या routerLink ? आपको हर एक का उपयोग कैसे करना चाहिए?


आप इसे सभी निर्देशों में देखेंगे:

जब आप कोष्ठक का उपयोग करते हैं, तो इसका मतलब है कि आप एक बाइंडेबल प्रॉपर्टी (एक चर) से गुजर रहे हैं।

  <a [routerLink]="routerLinkVariable"></a>

इसलिए इस चर (राऊटरलिंक वियरेबल) को आपकी कक्षा के अंदर परिभाषित किया जा सकता है और इसका मूल्य नीचे जैसा होना चाहिए:

export class myComponent {

    public routerLinkVariable = "/home"; // the value of the variable is string!

लेकिन चर के साथ, आपके पास इसे गतिशील अधिकार बनाने का अवसर है?

export class myComponent {

    public routerLinkVariable = "/home"; // the value of the variable is string!


    updateRouterLinkVariable(){

        this.routerLinkVariable = '/about';
    }

जहां कोष्ठक के बिना आप केवल स्ट्रिंग पास कर रहे हैं और आप इसे बदल नहीं सकते हैं, यह कठिन कोडित है और यह आपके पूरे ऐप की तरह होगा।

<a routerLink="/home"></a>

अपडेट करें :

विशेष रूप से राउटरलिंक के लिए कोष्ठक का उपयोग करने के बारे में अन्य विशेषता यह है कि आप गतिशील पैरामीटर को उस लिंक पर भेज सकते हैं जिसे आप नेविगेट कर रहे हैं:

इसलिए एक नया वैरिएबल जोड़ना

export class myComponent {
        private dynamicParameter = '129';
        public routerLinkVariable = "/home"; 

[राऊटरलिंक] को अपडेट करना

  <a [routerLink]="[routerLinkVariable,dynamicParameter]"></a>

जब आप इस लिंक पर क्लिक करना चाहते हैं, तो यह बन जाएगा:

  <a href="/home/129"></a>

मान लिया कि आपके पास है

const appRoutes: Routes = [
  {path: 'recipes', component: RecipesComponent }
];

<a routerLink ="recipes">Recipes</a>

इसका अर्थ है कि रेसिपी हाइपरलिंक पर क्लिक करने से http://localhost:4200/recipes कूद जाएगा

मान लें कि पैरामीटर 1 है

<a [routerLink] = "['/recipes', parameter]"></a>

इसका अर्थ है कि डायनेमिक पैरामीटर, लिंक से 1 गुजरना, फिर आप http://localhost:4200/recipes/1







angular-routerlink