app.js is:
directive('test', ['name', function ($name) {
return {/// DDO
template:'<h1>'.$name.'<h1>',
link: function () {
console.log($name);
}
};
}]).
While above name a service, which I am injecting into above directive. Above code works fine and data shows up both in console and web page.
BUT
error occurs when I replace template: $name with template: '<h1>'.$name.'</h1>'.
The error I get is this:
Uncaught SyntaxError: Unexpected string
So if I can't concatenate string named $name like that with <h1> tags then how do I do it there inside the DDO?
Note: Above given code is definitely not complete code, it's just the part I had problem with. Also service named name was declared/defined/created(or whatever it's called) by using value function.
Concatenation in JS is done with the + symbol.
directive('test', ['name', function ($name) {
return {/// DDO
template:'<h1>' + $name + '<h1>',
link: function () {
console.log($name);
}
};
}])
To concat string in javascript you have to use +
like this
'<h1>'+$name+'</h1>'
concat string by . is in php not in javascript
Related
I have simple handlebar template:
'<h1>Order number: {{orderNumber}}</h1>'
That works fine.
Now I have situation where object that I pass it for render has a function to return itself id. It goes like this:
'<h1>Order number: {{orderNumber}}</h1><h2>Order ID:{{getId()}}</h2>'
How can I make Handlebar execute getId() and place its value instead?
My failed attempt.
Template:
'<h4>Order number: {{orderNumber}}</h4><h4>{{#getId }}</h4>'
Registered function:
hbs.registerHelper('getId', function(param, opts) {
//return param.getId()
return 666;
});
No matter what I try I always get this error:
"Parse error on line 1:\n...{{#getId }}\n-----------------------^\nExpecting 'OPEN_INVERSE_CHAIN', 'INVERSE', 'OPEN_ENDBLOCK', got 'EOF'"
If I remove getId from the template, then it works as expected.
First you need to create new Handlebars helper:
Handlebars.registerHelper('getId', function(param, opts) {
return 1;
});
Then you can call it using:
<span>{{getId someParam}}</span>
Is there a way load class names as variables? new window[a] does not seem to work. I'm getting an error of TypeError: window[a] is not a constructor.
require([
'myController'
], function (myController) {
// this is working fine
// new myController().init();
$(function() {
var a = $('.test').attr('class'); // this returns myController
new window[a]; // error here
});
});
To do what you want you would need to use eval like this:
eval("new " + window[a] + "()");
Working example: https://jsfiddle.net/ybjo4pn9/
NOTE: Use eval with caution.
I simply use following code to call query() with ngRecourse, but it always hits “Undefined is not a function”
[demo.js]
var app = angular.module('StarterApp', ['ngResource']);
app.factory("resourceFactory", function($resource) {
return $resource("js/demo2.json", {}, {
'get':{method:'GET'},
'query':{method:'GET',isArray:true,url:"js/demo2.json"},
'save':{method:'POST'}
});
});
app.controller('appCtrl', function($scope, resourceFactory){
'use strict';
var ajax = new resourceFactory;
ajax.$query(function(response) {
console.log(response);
});
});
[demo2.json]
[
{"demo2":"test"}
]
[error]
TypeError: undefined is not a function
at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.min.js:9:466
at s (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:7:302)
at d.module.provider.$get.e.(anonymous function).q.then.p.$resolved (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.min.js:9:423)
at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:112:20
at l.$get.l.$eval (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:125:305)
at l.$get.l.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:122:398)
at l.$get.l.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:126:58)
at l (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:81:171)
at S (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:85:301)
at XMLHttpRequest.D.onload (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:86:315)
If I use "$get" with simple object return, it works. So I am pretty not sure what is going wrong with my code.
It should be simply resourceFactory.query instead of resourceFactory.$query & also there is no need to create a instance of object using new keyword
Code
resourceFactory.query(function(response) {
console.log(response);
});
I think this is because you try do promise on an Array.
I got the same issue and put the WebService array wrapped in a JSON
ie:
{ list: myArray })
instead of:
myArray
and works as a charm!
I use the same version of angularJS, and the undefined is looking for the push methods.
I just found the issue on GitHub Issue 56 and it's still open!
My Javascript code is
function ad_cart(nm, mmi, pr) {
alert(imm);
}
The value i'm passing from onclick is this
onclick="ad_cart(Drafting Factory Folders ,2,3.50)"
But it is showing a error as
SyntaxError: missing ) after argument list
In mozilla
In chrome the error is
Uncaught SyntaxError: Unexpected identifier
But if i pass integer instead of string like
onclick="ad_cart(1,2,3.50)"
then it is working fine
Try like
onclick="ad_cart('Drafting Factory Folders' ,2,3.50);"
And your function will be like
function ad_cart(nm, mmi, pr) {
alert(mmi); // Instead of `imm`
}
function ad_cart(nm, mmi, pr) {
alert(imm);
}
Seems to spell mistake also, getting mmi and showing imm
And the string should be wrap by ''
edit:
function ad_cart(nm, mmi, pr) {
alert(mmi);
}
ad_cart('string' ,number,number)
I am creating a typing game which I have "app.js" as a main and loading "words.js" by requirejs.
I need to use > 2 words but I am still naive with javascript and not sure this is right to do in AMD. Anyone could point me out. I would really appreciate it.
I think it would be like following code but it doesn't work and give me error
"Uncaught TypeError: object is not a function"
[app.js]
require(['jquery','app/canvas','app/words'], function($,game_screen,words){
var words1 = new words();
var words2 = new words();
.
.
});
[words.js]
define(['app/canvas'],function(canvas){
var word_list=[{"word1"},{"word2"},...];
return {
addWord: function(new_word){
.
.
});
Right now you're returning an object from your words module: { addWord: function() {} ... }. So in app.js, when you set words to be equal to the object returned from the words module, you would invoke the functions by doing words.addWord().
If instead you want to use the new words() syntax in app.js, you would have to change your words module to return a function instead of an object (hence the error):
define(['app/canvas'],function(canvas) {
var word_list=[{"word1"},{"word2"},...]; // not sure how this is used
function words() {
// some code
}
words.prototype.addWords = function() {
// some code
}
return words;
}