Question

我对角度库项目有疑问。我需要使用全局样式表对项目进行样式设置，但只会影响自身。我尝试创建一个组件，该组件包括CSS文件到主CSS文件。但这并不完全正常。这是ts文件的示例。

import { Component, OnInit, ViewEncapsulation } from '@angular/core';

@Component({
  selector: 'lib-organization',
  templateUrl: './organization.component.html',
  styleUrls: ['./organization.component.css'],
  encapsulation: ViewEncapsulation.None
})
export class OrganizationComponent implements OnInit {

  constructor() { }

  ngOnInit() {
    console.log('Hello World');
  }

}

还有我的图书馆项目模块：

import { NgModule } from "@angular/core";
import { GeneralConditionComponent } from "./components/contract/general-condition.component";
import { TransmissionConditionComponent } from "./components/contract/transmission-condition.component";
import { CompanyDetailComponent } from "./components/company/company-detail.component";
import { CompanyListComponent } from "./components/company/company-list.component";
import { RouterModule } from "@angular/router";
import { ConfigurationComponent } from "./components/configuration/configuration.component";
import { SalaryProgrammComponentComponent } from './components/salary-programm-component/salary-programm-component.component';
import { BrowserModule } from "@angular/platform-browser";
import { CommonModule } from "@angular/common";
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { OrganizationComponent } from "./organization.component";

@NgModule({
  declarations: [
    GeneralConditionComponent,
    TransmissionConditionComponent,
    CompanyDetailComponent,
    CompanyListComponent,
    ConfigurationComponent,
    SalaryProgrammComponentComponent,
    OrganizationComponent
  ],
  imports: [
    CommonModule,
    RouterModule.forChild([
      {
        path: "list",
        component: CompanyListComponent,
        data: {
          authorities: [],
          pageTitle: ""
        }
      },
      {
        path: "configuration",
        component: ConfigurationComponent,
        data: {
          authorities: [],
          pageTitle: ""
        }
      },
      {
        path: "contract/general-condition",
        component: GeneralConditionComponent,
        data: {
          authorities: [],
          pageTitle: ""
        }
      },
      {
        path: "contract/transmission-condition",
        component: TransmissionConditionComponent,
        data: {
          authorities: [],
          pageTitle: ""
        }
      },
    ]),
    FormsModule,
    ReactiveFormsModule,
  ],
  exports: [SalaryProgrammComponentComponent, FormsModule, ReactiveFormsModule, OrganizationComponent],
  bootstrap: [OrganizationComponent],

})
export class OrganizationModule {}

以下是我的项目结构的屏幕：

我在做什么错？

Answer 1

我想通了。我刚刚将图书馆项目模块配置为

RouterModule.forChild([
      {
        path: '',
        component: OrganizationComponent,
        children: [
          {
            path: "list",
            component: CompanyListComponent,
            data: {
              authorities: [],
              pageTitle: ""
            }
          },
          {
            path: "configuration",
            component: ConfigurationComponent,
            data: {
              authorities: [],
              pageTitle: ""
            }
          },
          {
            path: "contract/general-condition",
            component: GeneralConditionComponent,
            data: {
              authorities: [],
              pageTitle: ""
            }
          },
          {
            path: "contract/transmission-condition",
            component: TransmissionConditionComponent,
            data: {
              authorities: [],
              pageTitle: ""
            }
          },
        ]
      }
    ]),

如何在angular中包含库项目

1 个答案: