कोणीय 4 रूटिंग

Question

क्या लोग इस पोस्ट को कोणीय -4 रूटिंग के साथ टैग करने का सुझाव देना बंद कर सकते हैं? मुझे उस टैग के बारे में पता है। हालांकि, मेरी समस्या को कोणीय 4 के मार्ग के साथ नहीं करना था - यह एक गलती प्रश्न था, मैं नहीं था उस समय क्या हो रहा था। यहां समाधान उन लोगों की सहायता करेगा जो वास्तविक कोणीय 4 रूटिंग के साथ सहायता चाहते हैं, इसलिए मैं असहमत हूं कि इस तरह टैग किया जाना चाहिए और मैं उस परिवर्तन को अस्वीकार कर दूंगा। मैं दोहराता हूं: PHP, नोडजेस, डिस्ट फ़ोल्डर और अन्य सामानों का पूरा समूह समझने के बिना मानक होस्टिंग पैकेज का उपयोग करके एक कोणीय वेब-ऐप लॉन्च करने का प्रयास करना गलती थी। मैं बहुत से लोगों को इसी तरह की गलतियों को देखता हूं, लेकिन उन्हें यह जानने की ज़रूरत है कि यह समस्या को हल करने की समस्या नहीं है, क्योंकि वेबसाइटों की समस्या नहीं है, और उन्हें बस इतना करना चाहिए जैसा मैंने किया और बकवास किया और सामान सीखना।

मेरा कोणीय 4 रूटिंग काम नहीं कर रहा है।

• कोणीय 4 रूटिंग कोणीय 2 के लिए अलग है। कृपया केवल उन लोगों को जो कोणीय 4 टिप्पणी के साथ समान मुद्दों का सामना कर चुके हैं। ऐसा लगता है कि बहुत सारे बदलाव हुए हैं और मैंने 2017 दिशानिर्देशों के बाद अपना रूटिंग स्थापित किया है। इस के लिए पुराने समाधान चिह्नित करना सिर्फ भ्रामक और बेकार है - विशेष रूप से के रूप में मैं कोणीय करने के लिए नया हूँ और केवल 4 के अनुभव है मैं का उपयोग नहीं करना चाहते हैं HashLocationStrategy *

मैं अपने डोमेन पर नेविगेट कर सकते हैं, और फिर उपयोग करें पृष्ठों के बीच नेविगेट करने के लिए मेरा मेनू घटक, लेकिन जब मैं mydomain/home में टाइप करता हूं तो मुझे एक खाली पृष्ठ दिखाई देता है। ऐसा लगता है कि अन्य लोगों ने कोणीय के पिछले संस्करणों के बारे में समान प्रश्न पूछे हैं, लेकिन मैं किसी को नए सेटअप के साथ नहीं देख सकता।

मैं

import { routes } from './app.router'; 

app.module.ts

और app.router.ts

में

import { ModuleWithProviders } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 

import { HomeComponent } from './home/home.component'; 
import { ArtComponent } from './art/art.component'; 
import { MusicComponent } from './music/music.component'; 
import { EventsComponent } from './events/events.component'; 

export const router: Routes = [ 
    { path: '', redirectTo: 'home', pathMatch: 'full'}, 
    { path: 'home', component: HomeComponent }, 
    { path: 'art', component: ArtComponent }, 
    { path: 'music', component: MusicComponent }, 
    { path: 'events', component: EventsComponent } 
]; 

export const routes: ModuleWithProviders = RouterModule.forRoot(router); 

में

मुझे डर है कि मैं बहुत नया हूं कोणीय करने के लिए!

polyfills.71b130084c52939ca448.bundle.js:1 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. 
(anonymous) @ polyfills.71b130084c52939ca448.bundle.js:1 
firebug-lite.js:30396 [Deprecation] 'window.webkitStorageInfo' is deprecated. Please use 'navigator.webkitTemporaryStorage' or 'navigator.webkitPersistentStorage' instead. 
getMembers @ firebug-lite.js:30396 
home Failed to load resource: the server responded with a status of 404() 

मैं निर्माण के साथ समस्याओं यहां उन लोगों के समान करने के लिए नीचे इस मुद्दे संकुचित है:

ये क्रोम निरीक्षक में त्रुटियाँ हैं https://github.com/angular/angular-cli/issues/5113

वहाँ के लिए एक संतोषजनक जवाब नहीं लगती वह सवाल - अगर कोई मुझे बता सकता है कि मेरा निर्माण कार्य करने के लिए मेरा --बेस-href कहां इंगित करें?

Answer 1

मेरा कोणीय कोड ठीक साबित हुआ। समस्या मेरे होस्टिंग प्रदाता के साथ सर्वर के साथ थी। मुझे अपने dist पैकेज

Answer 2

आप @NgModule डेकोरेटर और आयात वहाँ अपने मार्ग

जैसे

@NgModule ({

imports: [ 
    RouterModule.forRoot(routes)// provide your routes array here 
] 

})

कथन काम नहीं करेगा निम्नलिखित, निर्यात उपयोग करने की आवश्यकता कॉन्स रूट: मॉड्यूलविथप्रोवाइडर्स = राउटर मॉड्यूल।forRoot (रूटर);

Answer 3

विधि - 1

में app.module.ts

. . . 

import { Routes, RouterModule } from '@angular/router'; 




imports: [ 
RouterModule.forRoot([ 
{ 
    path: '', 
    redirectTo: 'home', 
    pathMatch: 'full' 
}, 
{ 
    path: 'home', 
    component: HomeComponent 
} , 
{ 
    path: 'art' , 
    component: ArtComponent 
} 

. . . 


]), 

विधि -2 app.router ::

. . . 
export const router: Routes = [ 
{ path: '', redirectTo: 'home', pathMatch: 'full'}, 
{ path: 'home', component: HomeComponent }, 
{ path: 'art', component: ArtComponent }, 
{ path: 'music', component: MusicComponent }, 
{ path: 'events', component: EventsComponent } 
]; 
. . . . 

में निम्नलिखित सिर्फ जोड़े जिस तरह से आपने किया है और फिर अपने app.module.ts

में

import { routes } from './app.router'; 
. . . 
imports : [ 
RouterModule.forRoot(routers) 
] 

संदर्भ :: Angular Routing and Navigation

यह काम नहीं करता, तो मुझे टिप्पणियों में पता है।