मैं इस Starter Project की संरचना में फिट होने के लिए मौजूदा कोणीय ऐप को संशोधित करने का प्रयास कर रहा हूं। वैसे भी, तो मेरे पास एक सब्यूल्यूल (ट्यूटोरियल) के साथ मेरा ऐप मॉड्यूल है। जो इस तरह दिखता है:कोणीय 2.0 राउटर घटकों के लिए काम करता है मॉड्यूल नहीं?
रूट डोमेन पर उतरते समय और http://localhost:3000/tutorial/chapter/0 पर राउटर लिंक के साथ नेविगेट करते समय, सब कुछ ठीक काम करता है। हालांकि, अगर मैं पृष्ठ को रीफ्रेश या उस लिंक के लिए सीधे जाने की कोशिश, मैं त्रुटि मिलती है:
Unhandled Promise rejection: Template parse errors:
'my-app' is not a known element:
1. If 'my-app' is an Angular component, then verify that it is part of this module.
2. If 'my-app' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("
<body>
[ERROR ->]<my-app>
<div class="valign-wrapper">
<div class="preloader-wrapper active valign"): [email protected]:4 ; Zone: <root> ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse
तो मेरा मानना है कि यह हो रहा है क्योंकि बजाय कि यूआरएल appcomponent को जोड़ने, एक के रूप में ट्यूटोरियल submodule के साथ की तुलना में बच्चा, यह सिर्फ ट्यूटोरियल मॉड्यूल से जुड़ा हुआ है, और index.html से <my-app></my-app> टैग मान्यता प्राप्त नहीं हैं। यह पहले काम करता था, इसलिए मुझे यकीन नहीं है कि इस नई कॉन्फ़िगरेशन के किस पहलू ने इसे तोड़ दिया है।
import { homeComponent } from './components/home/home.component';
import { pluginsComponent } from './components/plugins/plugins.component';
import { Routes, RouterModule } from '@angular/router';
const appRoutes: Routes = [
{ path: '', component: homeComponent },
{ path: 'tutorial', loadChildren: 'tutorial/tutorial.module', pathMatch: 'prefix'},
{ path: 'plugins', component: pluginsComponent }
];
export const appRoutingProviders: any[] = [];
export const routing = RouterModule.forRoot(appRoutes);
और मेरे tutorial.routes.ts:
यहाँ मेरी app.routes.ts है
import { Routes, RouterModule } from '@angular/router';
import { tutorialComponent } from './tutorial.component';
import { chapterComponent } from './chapter/chapter.component';
const tutorialRoutes: Routes = [
{
path: 'tutorial',
component: tutorialComponent,
children: [
{ path: 'chapter/:id', component: chapterComponent },
{ path: '', redirectTo: 'chapter/0', pathMatch: 'full'},
]
}
];
export const tutorialRouting = RouterModule.forChild(tutorialRoutes);
मेरी app.ts जहाँ मैं एक्सप्रेस रास्ते को परिभाषित मेरे पास है:
app.all(/^\/tutorial$/, (req, res) => {
res.redirect('/tutorial/');
});
app.use('/tutorial/', (req, res) => {
res.sendFile(resolve(__dirname, '../public/index.html'));
});
सेवा करने के लिए ट्यूटोरियल घटक के लिए कोणीय सूचकांक।
पूरे रेपो here
क्या आपके पास सर्वर साइड रूट कॉन्फ़िगर किया गया है? यदि नहीं, तो यह काम नहीं करेगा। अब इसे काम करने के लिए आपको Wiith HashLocationStrategy जाना होगा। – micronyks
@micronyks खैर मेरे पास अंतिम स्निपेट है जो मेरे एक्सप्रेस सेटअप से एक अंश है, इसलिए मैंने सोचा कि इसे करना चाहिए? –
क्या आपने हैशलोकेशनस्ट्रेटी के साथ प्रयास किया है? – micronyks