Использование angular материального дизайна в качестве рамки проектирования без AngularJS

Ответ 1

Если вам нужна структура CSS, такая как Bootstrap, но с материальным дизайном, попробуйте http://materializecss.com/, который является адаптивной CSS-структурой на основе Material Design.

Ответ 2

Да, вы можете использовать Angular Материал, такой как bootstrap; однако их документация не так хороша, как бутстрап. Я использовал его в нескольких проектах, но вы должны привыкнуть к тому, как они хотят, чтобы вы включили в свой код директивы и классы CSS. Например, вы должны привыкнуть к использованию md-theme для включения настраиваемых тем, и вам нужно ознакомиться с тем, как их директивы выглядят внутри самого HTML. Например, тег insert md-text-float, который изменяется в md-input-group внутри HTML. Поэтому, если вы хотите выполнить какую-либо настройку CSS, вам нужно знать об этом изменении.

Что касается загрузочной сетки, Angular Материал не использует один из них. Они используют гибкую сетку, которая занимает немного времени, чтобы привыкнуть, если вы используете бутстрап или Bourbon Neat. Используя гибкую систему, Angular В дополнение к своим директивам md-toolbar и md-content материал использует атрибуты, такие как layout и layout-align.

Это определенно требует времени, чтобы привыкнуть, но становится все легче, поскольку вы узнаете, как они структурируют HTML и используют директивы. Если вы знаете Angular и как работают директивы, легче работать. Однако, если вы действительно хотите знать, как это работает, просто посмотрите на код внутри angular-material.js, который поставляется вместе с ним при загрузке с Bower.

Ответ 3

Вероятно, нет, так как материал angular имеет angular -aria, angular -animate и hammer.js в качестве зависимостей. И вы, вероятно, уже знаете, что для этого требуется AngularJS.

Вы увидите, что материал angular работает как пользовательские директивы в AngularJS.

Если вы действительно хотите использовать материал angular, я бы просто включил все необходимые javascripts, но материал angular действительно предназначен для использования в качестве временных примеров и демонстраций на данный момент (хотя Google недавно начал распространяя его через собственный CDN).

Ответ 4

Если вы не хотите использовать AngularJS, я рекомендую вам использовать Polymer Project. Это общая реализация спецификации Material Design.

Ответ 5

Angular Материал полезен, если у вас уже есть опыт или вы решили использовать AngularJS для своего проекта, в основном все компоненты указаны в качестве директив, и предполагается, что вы используете обычную инструментальную цепочку AngularJS.

Если вам не обязательно, например, или планируете использовать Angular в качестве интерфейсного интерфейса, то вам лучше использовать MDL (Material Design Lite), который больше похож на Bootstrap.

Angular Материал - это только одна из реализаций Material Design от Google.

• Спецификация MD была сделана для пользовательских интерфейсов приложений для Android.

• Затем он был реализован в Polymer как бумажные элементы. (https://elements.polymer-project.org/browse?package=paper-elements)

• Angular Далее появился материал;

• Совсем недавно Google выпустил Material Design Lite

Каждая из этих реализаций предназначена для другого типа проекта. Бумажные элементы - это веб-компоненты для проекта Polymer, Angular Материал - это библиотека дизайна для приложений AngularJS (альтернатива реализации AngularUI Bootstrap, действительно), а Material Design Lite, похоже, сделан для большего количества в настоящее время используются общие веб-сайты, такие как Bootstrap.

TL;DR

Если вам не нужны или нужны функции AngularJS, вам лучше использовать Material Design Lite (http://www.getmdl.io/) или некоторые другие приложения, отличные от Google, такие как Materialize, которые легко и просто вставлять в ваш текущий рабочий процесс.

Ответ 6

Если вы хотите создать загрузочную платформу, такую ​​как интерфейс пользовательского интерфейса, основанный на дизайне материала, но без AngularJS, лучше всего использовать само загрузочный файл с темами дизайна Bootstrap.