76

最近，MDL（Material Design Lite）项目的继任者作为Web 的 Material Components推出。它的目标之一是“与其他 JS 框架和库的无缝集成”。

还有另一个项目Angular Material2专门为 Angular (v2+) 提供材料设计组件。

这两个项目都在创建基于材料设计的UI 组件。此外，它们具有类似的组件组ready / in-active-development，以及与coming-soon 相同的组件组（在此处和此处列出）。

有人可以帮我理解两个项目之间的重叠，我应该为新项目选择哪一个？

从根本上说，我确实理解 Angular Material2 将与 Angular 项目更加无缝和紧密地集成，而 Web 的 Material Components 将为多个 JS 框架提供钩子以供使用。但我看不出重叠的原因，哪个会更有动力（阅读更多组件）。

4

5 回答 5

55

全面披露：我为 web 开发 Material Components，所以我的观点可能有点偏颇：）

TL;DR 使用任何可以帮助您以最有效的方式构建 UI 的库，或者并排使用它们。查看我们的 angular2 集成示例 angular-mdc-web查看如何使用 ng2 包装 MDC-Web 组件。

如前所述，Web 的 Material Components（缩写为MDC-Web）的目标是为整个 Web 平台创建 Material Design 组件的规范实现。Angular/material2 是一个优秀的库——我们 Material Design 团队中的许多人，包括我自己，都为它做出了贡献——但它对非 angular2 应用程序是排斥的。此外，React、Aurelia、Vue 等非谷歌库和框架没有官方解决方案来满足他们的需求。

话虽如此，Angular2 属于我们的“整个网络平台”范围，因此我们肯定希望支持它。在这两个项目的这个阶段，我们可能有一些你需要的组件，而 angular/material2 不需要，反之亦然。我鼓励您使用任何可以帮助您以最佳方式实现目标的库。这可能是 angular/material2，也可能是 MDC-Web，或者说实话，它可能两者兼而有之。例如，您可以将我们的选择组件与材料 2 的组件一起使用，并且一切正常。如 TL;DR 中所述，angular-mdc-web是一个功能齐全的库，它将 MDC-Web 包装在惯用的 angular2+ API 中。

最后一点，MDC-Web 是唯一由 Material Design 团队自己开发的库。因此，我们能够与编写 Material Design 规范的同一个人进行协作和迭代。

于 2016-12-19T22:28:24.157 回答
18

更新（2018 年 3 月 16 日）：

从@elDuderino Material2 提供的评论看来，Material2 似乎有办法自定义 . 提供的答案是在 Material 之前 cdk ..

https://material.angular.io/guide/customizing-component-styles

这两个框架现在都非常成熟。我在不同的项目中使用它们。我只用了一周的时间就将一个项目从一个框架迁移到另一个框架。所以我建议两者都试一下，看看你觉得哪个舒服。

我会分享我的经验。它的固执己见和偏见。喜欢被纠正。

我们从头开始并使用 Angular。我们决定使用材料。我开始寻找更好的框架并尝试了所有这些：Materialize、MDL、Angular Material 2，最后是 MDC for web。

这是我的观察，尤其是针对 Web 的 Material2 与 MDC。

材料2

  • 优点
    • 现成。一切就绪，准备开始工作
    • 接近 Angular 的架构

  • 缺点

    • 组件列表尚未完成（它们会随着时间的推移而消失，所以没关系）
    • 定制是不可能的

    我知道我们可以添加主题，仅此而已。组件的所有 HTML 和 CSS 都添加到 Angular 组件中。所以它被编译为 JavaScript 并在运行时应用。因此，没有办法覆盖该行为。我尝试了一个星期，但无法做到。

    这是我问的问题（其中一个标记为关闭，因为它似乎在征求意见-.-）

    如何自定义 Angular 材质 2

    如何扩展 Angular 组件样式

    当然，他们没有得到任何答案，我也无法自定义它们。如果我错了，请指导我。

检查上面提供的更新

网页版 MDC

  • 缺点

    • 不适用于 Angular

    如果您想以 Angular 方式进行操作，我们无法立即开始使用它。需要为每个组件编写 Angular 的包装器。可能要费点力气。但是每个团队都可以花一些时间进行定制，并且有第三方的努力使它更容易。如果可以不以角度方式进行操作，我相信我们可以在没有包装器的情况下开始。

    • 组件列表还没有完成（他们会随着时间的推移，所以没关系）

  • 优点

    • 通用的，不依赖于框架。总是安全的投资。
    • 更多贡献，因为其他框架开发人员也使用它。随着时间的推移，它得到了更多的贡献和未来的证明（几乎）
    • 完全可定制。
    • 似乎只有框架材料设计团队直接参与
    • 也可以将知识/风格用于移动设备。
    • 文档很棒。看起来投入了很多精力和时间。
于 2017-06-20T08:02:05.170 回答
4

对于考虑使用 Angular Material 2 的人，Sketch Material Plugin/Theme Editor 和 Gallery 工具仅适用于 MDC。我在同一条道路上，我从 Angular Material 2 开始，随着最近对 Angular Ivy 的介绍，我不确定团队将在 Angular Material 2 上投入多少精力。我正在转向 MDC，它是一个安全的选择。

从最近的自述文件：

计划在 2019 年第一季度至第二季度（1 月至 6 月）进行的高级别的东西：

  • Angular Material 团队的大部分成员都借给了帮助 Ivy 的框架团队。我们一直在使用 Angular CDK 和 Angular Material 测试来验证代码路径，并帮助调试将 Google 应用程序切换到新渲染管道的问题。
  • 我们还与 Material Design 团队合作制定更深入合作的战略。一旦我们的计划进一步推进，我们将在这方面分享更多信息。
  • 各种错误修正和次要功能改进。
  • 对树组件的 API 增强进行设计，以改善人体工程学。
于 2019-02-26T15:53:50.560 回答
2

Angular Material 团队似乎计划与 MDC 团队合作：

计划在 2018 年第四季度（10 月 - 12 月）发布的高级别内容：

  • 改进我们自己的构建和自动化工具
  • 修复错误并减少谷歌内部的一些技术债务
  • 制定有关如何与 MDC Web 团队合作的长期计划
  • 高级表格改进的设计（列调整大小、选择指令、内联编辑）

（自述文件）

这已在大约 20 天前（2018 年 10 月 10 日）添加到自述文件中。
所以很有可能，未来的 Angular Material 只是某种 Angular 包装器或 Web MDC 的 Angular 实现。

于 2018-10-31T15:59:15.480 回答
-1

Angular Material 2 仍然过时并且没有正确实现材料规范。不要使用它。

于 2019-05-21T19:10:04.513 回答