मुख्य ऐप फ़ाइल से अलग कोणीय 2 रूट कॉन्फ़िगरेशन

Question

मैं ऐप फ़ाइल से रूट कॉन्फ़िगर को अलग-अलग फ़ाइल (रूटकोनफिग.एट्स) में अलग करना चाहता हूं। हो सकता?

उदाहरण के लिए:

import {Component} from 'angular2/core'; 
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router'; 
import {DashboardComponent} from './dashboard/dashboard.component'; 


import {MessagesComponent} from '../modules/messages/messages.component'; 


@Component({ 
    selector: 'app', 
    directives: [ 
     ROUTER_DIRECTIVES 
    ], 
    templateUrl: './built/application/app.html' 
}) 

@RouteConfig([ 
    { 
    path: '/', 
    name: 'Dashboard', 
    component: DashboardComponent, 
    useAsDefault: true 
    } 
]) 

export class AppComponent {} 

मैं अलग फाइल में @RouteConfig पैरामीटर स्थानांतरित करने के लिए और सिर्फ मुख्य एप्लिकेशन फाइल के अंदर इसे लोड करना चाहते हैं। हो सकता? धन्यवाद। (रूट कॉन्फ़िगरेशन बहुत बड़ा होगा, इसलिए मैं इसे विभाजित करना चाहता हूं)।

पहली समस्या यह है कि जब मैं विभिन्न फ़ाइल में कॉन्फ़िगरेशन को स्थानांतरित करने का प्रयास करता हूं और बस ऐप फ़ाइल में JSON आयात करने का प्रयास करता हूं - मुझे अपरिभाषित घटक के साथ त्रुटियां मिलीं। क्योंकि घटक इसे s not a string. Can टी इस समस्या को हल करते हैं।

Answer 1

आप निश्चित रूप से सभी रूट परिभाषाओं को एक अलग फ़ाइल में ले जा सकते हैं।

मार्ग-definitions.ts की तरह एक फ़ाइल में:

import { RouteDefinition } from 'angular2/router'; 
import { HomeComponent } from './home/home.component'; 
import { AboutComponent } from './about/about.component'; 
import { InfoComponent } from './info/info.component'; 

export const RouteDefinitions: RouteDefinition[] = [ 
    { 
     path: '/', 
     name: 'Home', 
     component: HomeComponent, 
     useAsDefault: true 
    }, 
    { 
     path: '/about', 
     name: 'About', 
     component: AboutComponent 
    }, 
    { 
     path: '/info', 
     name: 'Info', 
     component: InfoComponent 
    } 
]; 

फिर वापस अपने app.component.ts में सिर्फ फाइल कार्य करें:

import { Component } from 'angular2/core'; 
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from 'angular2/router'; 
import { RouteDefinitions } from './route-definitions'; 

@Component({ 
    selector: 'my-app', 
    templateUrl: 'app/app.component.html', 
    directives: [ROUTER_DIRECTIVES], 
    providers: [ 
     ROUTER_PROVIDERS 
    ] 
}) 
@RouteConfig(RouteDefinitions) 
export class AppComponent { }