javascript console.log displays different values on same object

Question

I'm working on an AngularJS app. When I console.log an object (the attrs parameter of directive linking function) the browser show unconsistent results for the parameter "editable" (see image). In Chrome, the property gets valued as both "zzz" and undefined (see 5th row vs 1st). In Safari the output is displayed differently, but on console.log(object) the "editable" property appears as "zzz", while on console.log(object.editable) the property is undefined.

Any hints ?

I think this issue is related to: console.log() showing contradictory values for the same object property

console bug?

usign console.dir() is the same – Antonio Madonna May 15 '13 at 17:10 — Antonio Madonna, May 15 '13 at 17:10

Mark Rajcok · Accepted Answer · 2013-05-15T17:31:06.500

3

I'll guess that your HTML is something like this

<div my-directive editable="{{someScopeProperty}}"...></div>

and that you are calling console.log() in your link function. When the link function runs, interpolated attributes are not defined yet (you need to use $observe or $watch to asynchronously get the interpolated value), so you'll get undefined if you attempt to log the value. Soon after, the value gets defined, and Chrome seems to automatically update the value (which is really a reference, I think) in the console where you logged the full object (not just the individual value).

edited May 15 '13 at 17:31

answered May 15 '13 at 17:15

Mark Rajcok

362,217
114
495
492

great! that's exactly what I was doing and your explanation fits perfectly. – Antonio Madonna May 15 '13 at 17:29

javascript console.log displays different values on same object

1 Answers1

Linked