Я видел учебники и другие статьи, в которых даже не включался jQuery в проект при использовании Angular.js, чтобы сделать переход максимально полным. Однако, как мы делаем простые манипуляции с DOM css и другие вещи, такие как $('.item').css('top', '50px');, используя только Angular? (или это невозможно)?DOM Manipulation как JQuery с помощью AngularJS?
Угловой поставляется с lite version of jQuery, что позволяет подмножество jQuery. Вы можете по-прежнему включать jQuery, если хотите (должен быть включен до Angular).
Это возможно с использованием директивы ng-class. На вашем элементе, вы бы сказали:
<div ng-class="{'classWithTop50':myScopeVariable}"></div>
Где classWithTop50 определяется в CSS, как:
.classWithTop50{
top:50px;
}
Когда $ scope.myScopeVariable верно, то элемент будет иметь класс .classWithTop50
Мне очень жаль, но я не думаю, что я получаю свою точку зрения .. Как я могу динамически изменять CSS элемента, как я могу с помощью JQuery? –
Вы должны увидеть другие ответы для этой резолюции. Предпочтительный способ, если вы используете угловой, - это * не * манипулировать элементами напрямую и вместо этого использовать декларативный стиль на основе классов. Таким образом, они управляются моделью, и вам никогда не придется вручную менять стили на элементах. Доверьтесь мне; ваша жизнь становится легче, когда вы уходите от манипуляции с домом. –
Вы можете добавлять классы, как в ansewer, сообщенные fairweather, или вы также можете использовать ng-стиль для динамического стиля элементов. Если вы хотите больше манипуляций с DOM, вы можете создать Директиву для этого элемента и сделать все, используя jqlite в директиве.
Угловая версия поставляется с облегченной версией jQuery, которая позволяет подмножество jQuery.
Вы можете использовать это:
angular.element('.item').css('top', '50px');
Использование ng-class директива:
(от углового док)
<p ng-class="{'strike': deleted, 'bold': important, 'red': error}">Map Syntax Example</p>
=> это добавить 'удар' класса когда переменная области $scope.deleted == true, добавьте 'Жирный' класс, когда $scope.important == true ...
Угловая документ: http://docs.angularjs.org/api/ng.directive:ngClass
Не думаю, что в JQuery, думаю, в угловых (M-V- *). Угловой.элемент() есть для директив DOM-манипуляций. Обновления DOM должны выполняться с помощью угловых указаний; Обновления css и анимации с классами css.
Проверить мое решение :) – EpokK