路由有效,但未显示数据

时间:2019-07-27 19:42:55

标签: angular routing

我正在从角度8的懒惰加载中加载两个页面,页面已正确重定向,但页面上未显示数据。

下面是我的一些文件

app.module.ts

template<class Elem>
iterator my_list<Elem>::begin(){
return iterator();
}

app.component.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.html

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'crm-pj';
}

app-routing.module.ts

<div class="page-container">    
   <div class="left-content">
       <div class="mother-grid-inner">
            <!--header start here-->
                <div class="header-main">
                    <div class="header-left">
                            <div class="logo-name">
                                     <a href="index.html"> <h1>Shoppy</h1> 
                                    <!--<img id="logo" src="" alt="Logo"/>--> 
                                  </a>                              
                            </div>
                         </div>
                         <div class="header-right">

                            <div class="profile_details">       
                                <ul>
                                    <li class="dropdown profile_details_drop">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                                            <div class="profile_img">   
                                                <span class="prfil-img"><img src="images/p1.png" alt=""> </span> 
                                                <div class="user-name">
                                                    <p>Malorum</p>
                                                    <span>Administrator</span>
                                                </div>
                                                <i class="fa fa-angle-down lnr"></i>
                                                <i class="fa fa-angle-up lnr"></i>
                                                <div class="clearfix"></div>    
                                            </div>  
                                        </a>
                                        <ul class="dropdown-menu drp-mnu">
                                            <li> <a href="#"><i class="fa fa-cog"></i> Settings</a> </li> 
                                            <li> <a href="#"><i class="fa fa-user"></i> Profile</a> </li> 
                                            <li> <a href="#"><i class="fa fa-sign-out"></i> Logout</a> </li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                            <div class="clearfix"> </div>               
                        </div>
                     <div class="clearfix"> </div>  
                </div>
<!--heder end here-->
<!--inner block start here-->
<div class="inner-block" style="height: 500px">
    <router-outlet></router-outlet>
</div>
<!--inner block end here-->
<!--copy rights start here-->
<div class="copyrights">
     <p>© 2016 Shoppy. All Rights Reserved | Design by  <a href="http://w3layouts.com/" target="_blank">W3layouts</a> </p>
</div>  
<!--COPY rights end here-->
</div>
</div>
<!--slider menu-->
    <div class="sidebar-menu">
            <div class="logo"> <a href="#" class="sidebar-icon"> <span class="fa fa-bars"></span> </a> <a href="#"> <span id="logo" ></span> 
                  <!--<img id="logo" src="" alt="Logo"/>--> 
              </a> </div>         
            <div class="menu">
              <ul id="menu" >
                <!--<li id="menu-home" ><a href="index.html"><i class="fa fa-tachometer"></i><span>Dashboard</span></a></li>-->
                <li><a href="#"><i class="fa fa-cogs"></i><span>Masters</span><span class="fa fa-angle-right" style="float: right"></span></a>
                  <ul>
                    <li><a routerLink="/state">State</a></li>
                    <li><a routerLink="/city">City</a></li>                 
                  </ul>
                </li>
              </ul>
            </div>
     </div>
    <div class="clearfix"> </div>
</div>

stateComp.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [
    { path: 'state', loadChildren: () => import('./state/stateModule').then(m => m.stateModuleCls) },
    { path: 'city', loadChildren: () => import('./city/cityModule').then(m => m.cityModuleCls) },
    {
      path: '',
      redirectTo: '',
      pathMatch: 'full'
    }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }


stateModule.ts

//import {BrowserModule} from "@angular/platform-browser";
import {NgModule} from "@angular/core";
import {stateCompCls} from './stateComp';
@NgModule({
    imports : [],
    declarations : [stateCompCls],
    bootstrap : [stateCompCls]
})

export class stateModuleCls{

}

state.html

import {Component} from '@angular/core';
@Component({
    selector :'app-root',
    templateUrl : 'state.html',
})

export class stateCompCls{

}

当我重定向到状态重定向时可以正常工作,但是数据“状态模块”显示的城市不一样。

enter image description here

1 个答案:

答案 0 :(得分:1)

尝试在stateModuleCls中导入appModule