2016-06-16 5 views
4

Есть несколько Angular2 учебников на YouTube и другие сайты обучения, некоторые из которых использовали материал Design Lite (MDL) и некоторые из них использовали новый Angular2 Материала для демонстрационных целей.Material Design Lite (MDL) VS Angular2 Материал в Angular2 приложении

Учитывая, что Angular2 материал все еще довольно новый (в настоящее время в Альфа) и ограничены в количестве компонентов и документации по сравнению с MDL, который был бы лучшим вариантом для реализации в Angular2 в данный момент времени, и что являются плюсами и минусами каждого, характерного для Angular2?

ответ

4

MDL определенно тот, который лучше документирован (я не нашел никакой хорошей документации по материалу Angular2). Я думаю, что из-за этого MDL (в настоящее время) лучший выбор. Отрицанием MDL является то, что он не интегрирован в машинописный/угловой2.

Если вы собираетесь использовать компоненты MDL в своих шаблонах с компонентами Angular 2, вы можете расширить свой компонент из-за чего-либо, чтобы зарегистрировать компоненты MDL: (в противном случае анимация MDL не будет работать, поскольку они зависят от Код JavaScript)

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

Usage будет что-то вроде этого:

@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 Материал из альфа и имеет некоторую документацию, я бы переключиться на что, хотя.

0

Его полностью на вашем прецеденте. Будет ли ваш проект запущен в производство в ближайшее время или у него есть достаточно времени? Нужно ли вам настраивать компоненты пользовательского интерфейса до каждой детали или это очень общее назначение? Я много занимался исследованиями, и, поскольку у нас есть короткое время для выхода в производство, я выбираю Bootstrap Material Design URL: mdbootstrap.com Причина: Если u использует угловой материал Компоненты, ну во-первых, они в альфа-секунде, мой случай использования очень например, я бы назвал службы отдыха, чтобы заполнить даже основы, такие как радио, флажки.

Точка быть, если вам не хватает времени, требуют тяжелой настройки идут с MDL (Даже популярные Wijmo 5 NG2 компоненты используют его в настоящее время), или вы можете подождать и выбрать для angular2 материала.

0

Помимо материалов Angular2 и MDL, также существует MaterializeCSS, который является основой CSS, основанной на материальном дизайне. Их официальный веб-сайт находится по адресу http://materializecss.com

У них гораздо больше рабочих компонентов, чем предусмотрено MDL или Angular2-материалом, все с примерами и документацией.

Однако MaterializeCSS является основанной на JQuery, то есть ему требуется JQuery для активации динамического поведения некоторых компонентов. Посмотрите на https://www.npmjs.com/package/angular2-materialize. Этот пакет добавляет именно это динамическое поведение в приложения Angular2. Просто импортируйте MaterializeDirective в свой компонент Angular2, и он должен работать.