Слайд -шоу на основе AngularJs
Демо -адрес
Установка NPM
NPM Установите AngularJsslider
Как использовать
Шаг 1 (введение)
require ('angularjsslider') (модуль); // ввести
Шаг 2 (конфигурация параметров)
| тип | иллюстрировать | |
|---|---|---|
| данные | Множество | Слайд изображение данные [{img: "1.jpg", ссылка: '#'} ...] |
| таймер | Число | Слайд -переключатель таймер = "2" |
| BTN-Left | Нить | Левая кнопка переключения btn-left = "#btnleft" |
| BTN-Right | Нить | Кнопка переключения btn-right = ". Btnright" |
| Аниматический тип | Нить | Режим анимации переключения animate-type = "ext" |
| оживленное время | Нить | Переключение времени анимации animate-time = "1,0" секунды |
Шаг 3 (вставьте тег)
<lider> </slider> // вставить тег html
<div ng-controller="firstCtrl"> <slider timer="2" data="data" btn-left="#btnleft" btn-right=".btnright" animate-type="ease" animate-time="1.0"> </slider> <div id="btnleft"></div> <div></div> </div>
var mymodule = angular.module ('myApp', []); mymodule.controller ('firstctrl', function ($ scope) {$ scope.data = [{img: "../img/1.jpg", link:"#"}];});Выше приведено информация о реализации для AngularJS. Мы будем продолжать организовывать соответствующие знания в будущем. Спасибо за поддержку этого сайта!