I trying to log childElementCount property in chrome dev tools but I get undefined.
this is my code:
console.log('childElementCount---', this.ui.tbody.get('childElementCount')
returns childElementCount--- undefined
why is it undefined?
jQuery get() is for retrieving the underlying DOM element from the jQuery object. It accepts an integer index instead of a string.
Try this.ui.tbody.get(0).childElementCount or this.ui.tbody.get(0).getAttribute('childElementCount')
or withjQuery:
this.ui.tbody.prop('childElementCount')
or this.ui.tbody.children().length
Related
Our team is using angularjs to develop a ServiceNow widget and we are seeing "TyperError: Cannot read property 'length' of undefined" in our console:
When we click on "at eval", it takes us to this particular snippet of code with line 321 highlighted:
We can't seem to figure out what's causing that error. We are using $watch on an array ($scope.data.list) and have read that $watchCollection might be better, but we tried that with no change. Any ideas what could be causing this error and how to get rid of it?
From the code you have posted, you haven't defined or nor declared
$scope.data.list (I'm assuming $scope.data is defined somewhere). To
resolve that, you need to at least declare your $scope.data.list first to watch over it.
Coming to the $watch part, it depends on what your requirement is.
$scope.$watchCollection looks for changes made in the array as well as elements whereas,
$scope.$watch will only look for changes made if the array is totally
assigned to a different one. Otherwise, if you want to watch deep, you can
use $scope.$watch with a boolean true variable passed as a third
argument to it.
Refer this link for the full documentation - https://www.sitepoint.com/mastering-watch-angularjs/
As of my knowledge $watch on $scope.data.list called whenever any value changed in this collection
So by looking at error it seems like $scope.data.list list in no longer exits in $scope.data. Try to find out where $scope.data is going to change.
And use below syntax for watch on collection
$scope.$watchCollection('names', function(newList,oldList) {
if(newList && newList.length) {
$scope.data.list = newList.length;
}
});
I was working on an angular2 project that gets an object asynchronously from the api using the new Observable framework.
this._accountsService.getAccountDetails(this.id)
.subscribe(
AccountDetails => this.accountDetails = AccountDetails,
err => this.errorMessage = <any>err,
() => console.log(this.accountDetails)
);
When we tried to access the property of that object using interpolation {{AccountDetails.UserName}} ,we got a property undefined error, because the object had not yet been received from the api. We fixed this by instantiating the object in the class
accountDetails: AccountDetails = new AccountDetails();
This works, however I noticed in Angular 1, a fake object would be created, if the object was undefined, so that there would be never be an an undefined error -- it would just show an empty value in the interpolated code. Is this a change in Angular2? Also, I noticed that when we used *ngFor in our code to iterate through the properties of an object, it would display an empty value (rather than trigger an object undefined error) if the object had not yet been received from the api. Is this something that occurs internally in the *ngFor directive?
With first piece of code you need to do following things,
1) Because it should be {{accountDetails.UserName}} (not {{AccountDetails.UserName}} ). NOTE : Please double check with U or u that I can't tell without knowing object's properties.
2) You could also use ?. like {{accountDetails?.UserName}}
I hope this will help.
Angular 2 is based off Typescript so there is stricter type checking hence the undefined error.
One thing you can do to avoid any errors is use an
*ngIf="AccountDetails.UserName"
condition on the parent tag (parent of the *ngFor loop). This way it only gets rendered once the information has been loaded from the API. You can have some loading screen with the opposite condition
*ngIf = "!AccountDetails.UserName"
so it displays till the data has been loaded and then gets swapped out once the data has been loaded.
You can remove the
accountDetails: AccountDetails = new AccountDetails();
I have some problems with jsonp and AngularJs
I one page, i have to make about 15 json calls, each one by jsonp
My calls look like this :
$http.jsonp("http://www.example.com/feed1.json?callback=JSON_CALLBACK1")
And in my json feed, the data is wrapped by JSON_CALLBACK1
But i always obtain this error :
Uncaught ReferenceError: JSON_CALLBACK1 is not defined
Now i noticed in the network tab in the Google Chrome inspector that the call was :
http://www.example.com/feed1.json?callback=angular.callbacks._0
So i changed my json file, to wrap data with angular.callbacks._0(); instead, and it worked for this one, but it did not work for all my json
I started wraping all my jsons with angular.callbacks._1, angular.callbacks._2, angular.callbacks._3 ... byt i noticed that the number isn't always the same ? and if the number is a two digits, it doesn't work. For example, i tryed angular.callbacks._15, and i always obtain this error
Uncaught ReferenceError: angular.callbacks._15 is not defined
So is there a way to fix all those jsonp problems once for all with AngularJs ?
Thanks
The callback=angular.callbacks._123 parameter is an information for the server that the client (browser) expects the response to be wrapped inside a function named angular.callbacks._123 like so:
angular.callbacks._123({
"key": "value"
});
You should change your server code to inspect the parameter value and if present use it as the wrapping function name.
You can find more details in wikipedia.
I have this tag in my app
<body id="ctl00_ctl00_Body" menuopen="true">
I'm trying expect if the menu is true or false. Right now I've tried
var body = element(by.id('ctl00_ctl00_Body'));
expect(body.getCssValue('menuopen').toEqual('true'))
and getting the error
TypeError: Object [object Object] has no method 'toEqual'
Thanks for any help! I am still very new at this. Google'd for the last few days and couldn't find anything
A bracket is misplaced in your code.
expect(body.getCssValue('menuopen')).toEqual('true')
From jasmine documentation:
Expectations are built with the function expect which takes a value, called the actual. It is chained with a Matcher function, which takes the expected value.
In your case the matcher is toEqual
Answering the comment:
Getting this error now UnknownError: unknown error: failed to parse
value of GET_EFFECTIVE_STYLE
menuopen is not a css value but an element attribute. So you have to use getAttribute instead of getCssValue
expect(body.getAttribute('menuopen')).toEqual('true')
I am facing this issue when i am trying to store data in my angular controller page using the $cookieStore. Are there any additional configurations that I have left out ?
function fbLogin($cookieStore){
$cookieStore.put("userid",'12345');
validateUser(userid);
alert(userid);
}
You're not actually defining userId anywhere to JavaScript. You're setting a cookie whose value is userid=12345, but then calling validateUser with an unknown variable, userId which has the undefined value.