进入Angular。我试图建立一个工厂来存储动画功能。我唯一得到的是服务没有定义'在控制台中。这是一个代码链接:http://codepen.io/tplummerptc/pen/dGbKOp
var app = angular.module('App', []);
app.factory('soarimation', function(){
service.soarFlash = function(target, color) {
target = (target == undefined) ? false : target;
color = (color != 'default') ? 'defualt' : color;
// Set animation color
if(color != 'default') {
var aniClass = 'flash-'+color;
} else {
var aniClass = 'flash';
}
if(!target) {
$(this)
.closest(target)
.addClass(aniClass)
.delay(1000)
.queue(function(next){
$(this).removeClass(aniClass);
next();
});
} else {
$(this)
.addClass(aniClass)
.delay(1000)
.queue(function(next){
$(this).removeClass(aniClass);
next();
});
}
}
});
app.controller('addRow',function($scope, soarimation){
$scope.submitRow = function(event){
angular.element(event.currentTarget).soarFlash('li');
}
});
答案 0 :(得分:1)
angularjs中的工厂总是返回一个对象。您必须在app.factory
方法中声明服务对象,然后向其中添加所需的函数和变量。最后返回那个对象。您可以使用工厂名称在控制器中使用此对象。
app.factory('soarimation', function(){
var service = {}; //Declaring the object
service.soarFlash = function(target, color) {
target = (target == undefined) ? false : target;
color = (color != 'default') ? 'defualt' : color;
// Set animation color
if(color != 'default') {
var aniClass = 'flash-'+color;
} else {
var aniClass = 'flash';
}
if(!target) {
$(this)
.closest(target)
.addClass(aniClass)
.delay(1000)
.queue(function(next){
$(this).removeClass(aniClass);
next();
});
} else {
$(this)
.addClass(aniClass)
.delay(1000)
.queue(function(next){
$(this).removeClass(aniClass);
next();
});
}
}
return service; // Return the object
});
app.controller('addRow',function($scope, soarimation){
$scope.submitRow = function(event){
var elem = angular.element(event.currentTarget);
soarimation.soarFlash(elem);
}
});