Как включить библиотечный проект в угловой - PullRequest
Новая
       106

Как включить библиотечный проект в угловой

0 голосов
/ 20 сентября 2019

У меня проблема с проектами угловой библиотеки.Мне нужно стилизовать проект с помощью глобальной таблицы стилей, но повлиять только на себя.Я попытался создать компонент, который включает 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 {}

Вот несколько экранов структуры моего проекта:

enter image description here

Что я делаю не так?

1 Ответ

0 голосов
/ 20 сентября 2019

Я разобрался.Я только что настроил свой модуль проекта библиотеки на 

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: ""
            }
          },
        ]
      }
    ]),
...