나는 내가 이루고자하는 것이 쉬울 것이라고 확신하지만, 2 일을 함께 보낸 Angular나는 여전히 갇혀있다.
JS
var app = angular.module('mays', []);
app.controller('Slider', function ($scope) {
$scope.sliderItems = [
{
number: 1,
title: 'Goals',
text: 'We did stuff and stuff'
}
];
});
//A directive is what I believe I need.
//JS Plugin
app.directive('sliderDirect', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
$('.slider').royalSlider();
}
};
});
나는 나를 위해 jQuery가 과잉임을 인정해야한다. 그러나 나는 게으르고 일을 빨리 시작하고 싶다.
HTML / Jade
ul(class='slider royalSlider rsDefault', ng-repeat='item in sliderItems', ng-model='sliderDirect')
li
h1 {{item.title}}
p {{item.text}}
img(ng-src='/img/news/{{item.number}}.jpg')
기본적으로 필요한 것은 한 번 실행할 플러그인 Angular이 markup.
지시문을 모델이 아닌 속성으로 추가합니다.
ul(class='slider royalSlider rsDefault', ng-repeat='item in sliderItems', slider-direct)
Angular는 자동으로 camel case 지시문을 HTML에서 사용 하기 위해 다음 sliderDirect-> 로 변환 slider-direct합니다. 또한 속성이있는 요소에 지시문을 적용 element하려면 link함수 의 변수를 대상으로 지정해야합니다.
return {
restrict: 'A',
link: function(scope, element, attrs) {
$(element).royalSlider();
}
};
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다