将Bootstrap用于Angular和Material Design一起用于Angular [英] Using Bootstrap for Angular and Material design for Angular together
问题描述
我正在使用这个.
I'm working on a project with this template.
该模板是使用AngularJs和Bootstrap-UI(用于角度的Bootstrap)编写的，我想包括一些材料设计元素，例如卡片等.
The template is written using AngularJs and Bootstrap-UI (bootstrap for angular) and I would like to include some Material Design elements like cards and others.
有可能这样做吗?推荐吗? 我的事情是，我们已经喜欢这个模板以及它的许多元素了，但是Material Design包含卡片，下拉菜单，带有标签动画的文本输入等，这些都是很棒的.
Is it possible to do that? is it recommended? My thing is we already love this template and way to many elements of it, but Material Design have cards, dropdown, text inputs with the label animation etc for example which are amazing.
所以我的问题是:
AngularJS + Angular的Bootstrap + Angular的材质设计=令人敬畏还是灾难?
AngularJS + Bootstrap for Angular + Material Design for Angular = Awesomeness or Disaster?
推荐答案
如果同时添加了引导程序&棱角分明的东西，这将发生
If you add both bootstrap & angular-material this is what will happen
-
两者都具有以您的前端元素为目标的css(例如input
元素，按钮)
Both have css which will target your front end elements (e.g. input
element, buttons)
每个人都有自己的外观&感觉(即Bootstrap输入元素与Material输入元素不同).因此，您的整个项目将不会只有一个外观&感觉.
Each have their own look & feel (i.e. Bootstrap input element is different from Material input element). So, your overall project won't have one single look & feel.
如果同时添加这两种样式，则必须注意css样式在公共部分(例如，字体大小和字体系列)上会覆盖其他样式.
If you add both you will have to take care of css styles overriding others on common parts (e.g. font size & font family).
角度材料以角度方式处理前端元素(指令) 因此，当他们发布新版本(到目前为止有29个版本)时，您将不得不花一些时间测试您的早期代码(例如，他们将$ media更改为$ mdMedia以处理sideMenu).我花了很多时间来寻找为什么我的sideMenu停止工作的原因！.
Angular-material handles front end elements in angular way ( directive) So when they release a new version (29 releases so far), you will have to spent some time testing your earlier code (e.g.they changed $media to $mdMedia for handling sideMenu). I've spent a lot of time finding why my sideMenu stopped working!.
如果使用两个前端框架，则项目依赖项的总体大小将增加.
You overall size of project dependencies will increased if you are using two front end frameworks.
Angular-material需要它自己的依赖项，例如'angular-animate'& 'angular-aria'.
Angular-material needs its own dependencies like 'angular-animate' & 'angular-aria'.
谈论您的"md卡"有面板"在引导程序中，您可能想此处
Talking about your "md-cards" there are "panels" in bootstrap you might wanna have a look here
我建议您坚持使用引导程序或有角度的材料.两者都很棒，只是不要混在一起.
这篇关于将Bootstrap用于Angular和Material Design一起用于Angular的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
