각도 4.3 앱에서 각도()에 재질 구성 요소를 사용하려고합니다. 모든 것을 설치했고 app.component.html 파일에 버튼을 추가 했으므로 버튼이 렌더링되고 여기에있는 것처럼 동작합니다 https://blox.src.zone/material#/directives/button.각도가 지정된 라우팅 구성 요소
그런 다음 내 경로 중 하나에 버튼을 추가하려고 시도했지만 버튼이 동일하게 렌더링되지 않았습니다. 그것은 부트 스트랩 CSS가 점령 한 것과 같습니다.
라우팅 할 구성 요소에 무엇을 가져와야합니까?
질문에 대한 답변이 충분하지 않습니다. (프로젝트를 어떻게 구축 할 것인가? 머티리얼 구성 요소의 스타일 시트를 어디에 두 었는가, 웹팩, 각도 cli, 롤업 또는 다른 빌드 도구 등을 사용 하는가?). 그러나 (충분히 평판이 아니라) 내가 말할 수 없기 때문에, 나는 그것을 시도 할 것이다.
@Component 메타 데이터에 styleUrls 선언을 통해 단일 앱 구성 요소에 스타일 시트 (아마도 css 또는 scss)를 추가 한 것 같습니다. Angular는 기본적으로 구성 요소의 스타일을 캡슐화하므로 해당 스타일은 앱 구성 요소에만 적용됩니다.
Blox Material 프로젝트의 경우, 일반적으로 재료 구성 요소 스타일 시트를 스크립트 태그를 통해 html에 포함 된 응용 프로그램 전체 스타일 시트로 추가하려고합니다. 프로젝트가 Angular-CLI 프로젝트 인 경우이 파일은 .angular-cli.json 파일에 지정된대로 응용 프로그램의 "스타일"필드에 명명 된 파일입니다. 이것은 또한 Blox Material에 대한 시작 안내서가 설명하는 내용입니다 (https://blox.src.zone/material#/guides/gettingstarted 참조).
또는 스타일 시트를 동시에 여러 구성 요소에 적용하려면 앱의 루트 구성 요소에 스타일 시트를 넣거나 encapsulation: ViewEncapsulation.None으로 재생하여 @Component 메타 데이터에 넣을 수 있습니다.
그래도 도움이되지 않는 경우 조금 더 자세한 정보를 제공하고 개발자 도구를 사용하여 앱 구성 요소에 적용 할 스타일 및 선택기를 확인하십시오. 아마 당신의 다른 구성 요소에 적용되지 않는 이유에 대한 단서를 제공 할 것입니다. 또한 부트 스트랩과 같은 다른 스타일이 재료 구성 요소 스타일을 무시하는 경우 알려줍니다.
마지막으로 Blox Material 지정 문이 실제로 단추에 적용되는지 확인하십시오. mdcButton은 자동으로 적어도 mdc-button 및 mdc-ripple-upgraded 스타일을 가져야합니다. 버튼에 이러한 스타일이 표시되지 않으면 mdcButton 지시문을 적용한 방법에 문제가 있습니다.