引导程序不起作用并且不显示数据(角度)

时间:2019-01-23 14:43:48

标签: angular

我开始了这个Angular课程,但我一开始就陷入了困境……我通过其指南安装了Bootstrap,但仍然出现空白页面。

重新安装整件事didint帮助

angular.json

"styles": [
          "src/styles.css",
          "./node_modules/bootstrap/dist/css/bootstrap.min.css"

        ],
        "scripts": [
          "node_modules/jquery/dist/jquery.slim.min.js",
          "node_modules/popper.js/dist/umd/popper.min.js",
          "node_modules/bootstrap/dist/js/bootstrap.min.js"
        ],

app.component.ts

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

@Component({
  selector: 'app-root',
  template: `<app-server></app-server>
              <app-server></app-server>`,
  styleUrls: ['./app.component.css',]
})
export class AppComponent {
  title = 'title';
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { ServerComponent } from './server/server.component';
import { ServersComponent } from './servers/servers.component';
@NgModule({
  declarations: [
    AppComponent,
    ServerComponent,
    ServersComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.html

<div class="container">
  <div class="row">
    <div class="col-xs-1-12">
      <h3>new component here</h3>
      <hr>
      <app-servers></app-servers>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

Angular 2+的引导程序由NgBootstrap命名。您可以在第https://ng-bootstrap.github.io/#/home页上查看它们

通过在解决方案中安装Ng bootstrap的依赖项,将其插入package.json中

npm install --save "@ng-bootstrap/ng-bootstrap"

如果您没有在计算机中安装ng-bootstrap,则需要全局安装它,然后添加-g标志进行安装

npm install -g "@ng-bootstrap/ng-bootstrap"

然后尝试使用拳头命令重新安装