时间戳

首页 > 解决方案 > Angular 组件不会被调用

angular - Angular 组件不会被调用

问题描述

我刚开始有角度的项目。我创建universal-table.component了只有 2 次打印到控制台的新组件，但似乎没有调用该组件。当我进入浏览器日志填充时，HTML 未加载到浏览http://localhost:4200/model器中，但我可以UniversalTableComponent_Host.ngfactory.js在 Firefox 的“调试”选项卡中看到。

零件：

import { Component, OnInit } from '@angular/core';
import {UniversalTable} from "./universal-table.model";

@Component({
  selector: 'app-universal-table',
  templateUrl: './universal-table.component.html',
  styleUrls: ['./universal-table.component.css']
})
export class UniversalTableComponent implements OnInit {
  private model: UniversalTable;

  // public universalTable: Field = new Field();

  constructor() {
    console.log("1");
  }

  ngOnInit() {
    console.log("2");
  }
}

路由器：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { UniversalTableComponent } from './universal-table/universal-table.component';


const routes: Routes = [
  {path: 'model', component: UniversalTableComponent}
];

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

标签： angularangular-router

解决方案

在你的app.component.html你应该把

<router-outlet></router-outlet>

这是您的组件将被渲染的地方。

推荐阅读