Witam,
Tworze sobie prostą aplikacje web opartą na angular i jquery. Sprawa wygląda tak, że mam zdefiniowany kontroler wewnątrz którego mam kilka właściowśći oraz jedna dyrektywe. Dyrektywa ta zwraca pewną funkcje w której chciałbym mieć dostęp do property kontrolera, ale np. zwykłe
this.var = 5;
czy
$scope.var = 5;
nie działa.
Kod kontrolera:
app.controller('dotsKillerCtrl', function($scope){
$scope.points = 0;
$scope.displaySpeed = 400;
$scope.growSpeed = 2;
$scope.init = function() {
var newDot = setInterval(function(){
$scope.growDots();
}, this.displaySpeed);
};
$scope.randomInt = function() {
return Math.floor(Math.random() * (95 - 5 + 1) + 5);
};
/*
$scope.generateDots = function() {
};
*/
$scope.growDots = function() {
$('.dot').each(function(){
var dotWidth = $(this).css('width'),
dotHeight = $(this).css('height'),
dotRadius = $(this).css('border-radius');
dotWidth = dotWidth.replace('px', '');
dotWidth = Number(dotWidth);
dotHeight = dotHeight.replace('px', '');
dotHeight = Number(dotHeight);
dotRadius = dotRadius.replace('px', '');
dotRadius = Number(dotRadius);
$(this).animate({
width: dotWidth + $scope.growSpeed,
height: dotHeight + $scope.growSpeed,
'border-radius': dotRadius + $scope.growSpeed,
'margin-left': dotWidth - ((dotWidth / 2) * 3),
'margin-top': dotHeight - ((dotHeight / 2) * 3)
},200);
});
};
$scope.killDot = function(){
$(this).addClass('clicked');
};
});
app.directive("dot", function() {
var linkFunction = function(scope, element, attributes) {
var paragraph = element.children()[0];
$(element).on("click", function() {
var dotWidth = $(this).css('width'),
dotHeight = $(this).css('height'),
dotRadius = $(this).css('border-radius'),
dotMl = $(this).css('margin-left'),
dotMt = $(this).css('margin-top');
dotWidth = dotWidth.replace('px', '');
dotWidth = Number(dotWidth);
dotHeight = dotHeight.replace('px', '');
dotHeight = Number(dotHeight);
dotRadius = dotRadius.replace('px', '');
dotRadius = Number(dotRadius);
dotMl = dotMl.replace('px', '');
dotMl = Number(dotMl);
dotMt = dotMt.replace('px', '');
dotMt = Number(dotMt);
$(this).animate({
width: dotWidth - 10,
height: dotHeight - 10,
'border-radius': dotRadius -10,
'margin-left': dotMl + 5,
'margin-top': dotMt + 5
},200);
dotWidth = $(this).css('width');
dotWidth = dotWidth.replace('px', '');
dotWidth = Number(dotWidth);
if(dotWidth <= 5){
$(this).remove();
/*
tutaj chciałbym inkrementować wartość $scope.points
*/
};
});
};
return {
restrict: "E",
link: linkFunction
};
});
Tam gdzie zaznaczyłem, wewnątrz linkFunction() chciałbym mieć możliwość operowania na wartościach $scope.points.