Question

YouTube和其他学习网站上有一些Angular2教程，其中一些使用了 Material Design Lite（MDL），有些使用了新的 Angular2材料演示目的。

考虑到Angular2 Material仍然相当新（目前处于Alpha状态）并且与MDL相比，组件和文档的数量有限，这将是Angular2中实现的更好选择时间和Angular2特有的优点和缺点是什么？

Answer 1

MDL绝对是更好的文档（我没有找到任何关于Angular2材料的好文档）。我认为因此，MDL （目前）是更好的选择。 MDL的不利之处在于它没有集成在typescript / angular2中。

如果你要在Angular 2组件模板中使用MDL组件，你可以从这样的东西扩展组件，以便注册MDL组件:(否则MDL动画将不起作用，因为它们依赖于的JavaScript）

declare var componentHandler: any;
export class MaterialTemplate {
    ngAfterViewInit(){
        componentHandler.upgradeAllRegistered();
    }
}

用法是这样的：

@Component({
    selector: 'my-selector',
    template: `
        <form action="#">
        <div class="mdl-textfield mdl-js-textfield">
        <input value="{{bleh}}" class="mdl-textfield__input" type="text" id="sample1">
        <label class="mdl-textfield__label" for="sample1">Text...</label>
        </div>
        <button (click)="action()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent">
        create
        </button>
        </form>`
})
export class CreateComponent extends MaterialTemplate {...}

一旦Angular2 Material不在alpha并且有一些文档，我会切换到那个。

Answer 2

完全取决于您的使用案例。 您的项目很快就会投入生产，还是有相当长的时间？您是否需要将UI组件自定义为每个细节，还是非常通用？我一直在研究很多，因为我们有很短的时间投入生产，我选择Bootstrap Material Design URL：mdbootstrap.com 原因：如果你使用角度材料组件，首先他们在alpha秒，我的用例是非常自定义的，例如我将呼叫休息服务，以填充甚至基本，如收音机，复选框。

点，如果你的时间很短需要大量定制，请使用MDL（即使是流行的Wijmo 5 ng2组件现在正在使用它），或者你可以等待并选择angular2材料。

Answer 3

除了Angular2-material和MDL之外，还有一个MaterialiseCSS，它是一个基于材料设计的CSS框架。他们的官方网站位于http://materializecss.com

它们具有比MDL或Angular2材料提供的更多工作组件，所有组件都带有示例和文档。

然而，MaterialiseCSS是基于JQuery的，即它需要JQuery来激活某些组件的动态行为。看看https://www.npmjs.com/package/angular2-materialize。此包将此动态行为添加到Angular2应用程序。只需导入Angular2组件中的MaterializeDirective即可。

Angular2 app

3 个答案: