I am using the Polymer framework for my project in which I'm declaring a function callback in properties and trying to call it from another function. But on accessing it I'm getting an error:
Uncaught TypeError: this.callback is not a function
Please have a look into this.
Polymer({
is: "parent-dom",
properties: {
people: {
type: String,
value: "df"
},
item: {
type: String,
value: "asdf",
notify: true
},
callback: {
type: Object,
value: function(index) {
console.log("Inside callback function");
}
},
},
showTargetColorDialog: function(e) {
this.callback("sadf");
}
});
Could you please provide more details about what you would like to achieve, since specify Polymer properties as functions it's not very common case?
So you could declare public methods on your element, like you did with showTargetColorDialog, and they will be accessible to be called like:
document.querySelector('parent-dom').showTargetColorDialog();
But again it's not very "Polymer way" to that.
To answer your original question, if you really need set callback as Polymer property (I'm still not sure why), but you could:
callback: {
type: Object,
value: function() {
return function(index) {
console.log("Inside callback function ", index);
};
}
},
And then you will be able to call this.callback('something');
Related
I am using updatingAll method in loopback but it is not working I am not able to understand the reason
I have written something like this
let data = {
isActive: false
};
myModel
.updateAll(data, {
id: {
inq: questionIds
},
});
The order of parameters in updateAll seems to be incorrect. From documentation:
PersistedModel.updateAll([where], data, callback)
Also, it seems a callback function is required.
Callback function called with (err, info) arguments. Required.
So your call should look like this:
let data = {
isActive: false
};
myModel.updateAll({
id: {
inq: questionIds
},
}, data, (err, info) => null); //might want to add error checking to callback function
I am trying to pause the rendering of an a-entity with a custom function that utilizes the .pause() method. Here is my Aframe component:
<body style="margin : 0px; overflow: hidden;">
<script>
AFRAME.registerComponent('intro', {
schema: {
array: { type: "array", default: ["Hi! I'm Ducky and welcome to", "Black", "Duck"] }
},
init: function() {
const self = this;
pauseTextRender(self);
}
function pauseTextRender(component) {
component.pause();
}
});
</script>
</body>
This is bare minimum. When I check the console I get the error Uncaught SyntaxError: Unexpected token function. I'm not too familiar with Javascript but how can I make an acceptable function for the Aframe class?
Your Javascript Syntax is incorrect. Which is why you are getting the syntax error. Try doing something like this:
,
/**
* Setup fade-in + fade-out.
*/
setupFadeAnimation: function() {
var data = this.data;
var targetEl = this.data.target;
// Only set up once.
if (targetEl.dataset.setImageFadeSetup) {
return;
}
targetEl.dataset.setImageFadeSetup = true;
// Create animation.
targetEl.setAttribute('animation__fade', {
property: 'material.color',
startEvents: 'set-image-fade',
dir: 'alternate',
dur: 500,
from: '#FFF',
to: '#000'
});
}
Notice the comma which would be after your init function and the way I declare the function setupFadeAnimation.
To answer the question - unexpected token: function is because your pauseTextRender declaration is incorrect in this context. It would be absolutely correct in a different context but, for this one, you need to do :
pauseTextToRender: function(component){
component.pause();
}
So your entire registration would look like :
AFRAME.registerComponent('intro', {
schema: {
array: {
type: "array",
default: ["Hi! I'm Ducky and welcome to", "Black", "Duck"]
}
},
init: function() {
const self = this;
pauseTextRender(self);
},
pauseTextRender: function(component) {
component.pause();
}
});
(Note the comma after the init declaration as well)
This is because inside an object you have pairs like so :
{
name: "value",
anotherName: "another value"
}
...and what was happening for you was that you were giving the value function pauseTextRender(component){ ...etc... } without giving the name, and not separating your declarations with a comma.
Hope that helps!
I have added a custom action to a $resource:
var myResource = $resource('some/url/:someParam',
{
someParam: '#someParam'
},
{
update: {
method: 'PUT'
}
});
I am attempting to have a function run on completion. According to Angular's documentation, I'd do it in the following way:
non-GET "class" actions: Resource.action([parameters], postData, [success], [error])
Yet the following never invokes the success function even though the request is successful:
myResource.update({ someParam: 'a value' }, { myPostData: 'goes here' }, function(a,b) {
// this function never gets invoked
});
The documentation also says this:
The Resource instances and collections have these additional properties:
$promise: the promise of the original server interaction that created this instance or collection.
But this doesn't work either:
myResource.update({ someParam: 'a value' }, { myPostData: 'goes here' }).$promise.then(function() {
// do stuff
});
Am I missing something here? Any help would be greatly appreciated.
How can I access object properties from functions which will be called as callback function. Please see code below. How can I access config property from processData function which will called when data is received from the server in ajax call.
MyClass: {
config: {
name: "",
id: ""
},
loadData: function() {
MyApi.getData(
this.config,
this.processData, //sucess
this.failureHandler //failure
);
},
processData: function() {
// how to access config object here?
}
}
Probably you can create an anonymous handler function and use call or apply to pass the this scope to actual handler function but is there a better solution than that?
I am using jQuery v1.8.3 and jQuery UI v1.9.2. I have implemented the Autocomplete widget this way:
$('#input_id').autocomplete({
create: function (event, ui) {
// Initialize data
$(this).data( 'custom', { property1: 'Hello', property2: { num: 1, funct: function() { ... return value } } );
alert($(this).data('custom').property1) // Display 'Hello'
},
select: function(event, ui) {
alert($(this).data('custom').property1) // Display 'Hello'
},
source: function(request, response) {
alert($(this).data('custom').property1) // Display 'undefined'
alert(this.data('custom').property1) // I get 'TypeError: this.data is not a function'
}
});
Why in the source option I get undefined while in create and select events I get Hello? How should I properly access the number property in the search option context so to get Hello?
You're getting undefined there, because apparently this inside source function refers to anonymous function, not to the INPUT you're assigning data to in create function.
Use other means to access input inside source function.
$('#input_id').autocomplete({
create: function (event, ui) {
// when using "this" here, you're refering to #input_id input
},
source: function(request, response) {
// when using "this" here, you're refering to anonymous function
}
});
To access your data within source function use following:
// ...
source: function(request, response) {
// you don't need to wrap this.element in jQuery again since it is already wrapped
this.element.data('custom').property1
}
Demo for future quick reference: http://jsbin.com/ojesig/1/edit