I'm trying to figure this out and have done some test prints to see what's going on at various stages and parts of a widget I'm editing. The server-side sets a value "shortDesc" which is used to print the title of the KB article in the HTML (no idea what the :: preceding the value is though... what is that about?). The problem that it gets the shortDesc value from the knowledgeRecord object which, if I set to a variable to keep it for a sec and then print it in HTML to confirm its value, is blank.
So where is shortDesc getting it's value from? This line is the only one in the Server side that references this value:
Also, the "stuff" value is only set on this one line, immediately after the other which shows that the value set is empty, even though somehow it's not empty when HTML prints it. It's dark magic, surely.
Also, what is the double colon doing there? What does that signify? If I remove it, it works exactly the same.
Hello @jeremyduffy ,
You need to use the "Log to console: $scope.data" option.
It won't show your code. It will show you the properties of the "data" object so that you can verify if they have the expected values.
But you need to do that while right-clicking on your widget on an actual portal page as shown in my screen shot. It seems you right-clicked on the widget editor (which is a widget itself).
The reason why your "stuff" object appears to have empty properties is that you have assigned the "knowledgeRecord" object to it, which is a GlideRecord Java object and not a native JavaScript object. So "knowledgeRecord.short_description" is not a string but a GlideElement Java object, which cannot be "stringified" to JSON (which is what happens when you add {{data.stuff}} to the HTML template) and that's why you just see the "empty object" / {}.
On the other hand, "data.shortDesc" has a value that AngularJS can work with, because your code casts it to an actual JavaScript string by adding the "".
knowledgeRecord.short_description.getDisplayValue() + "";
You still have not clarified what's the actual issue you are trying to debug. You mention that the short description / title "works fine", so what is not working?
Regards,
Robert
Hello @jeremyduffy ,
A double colon in AngularJS indicates a one-time binding of the value.
In short it means that, if the value of "data.shortDesc" were to change again at a later time (for example because the server script is loading another article) then that update would not reflect on the UI. This is typically used a means to improve performance in AngularJS if we know that the value is never going to change.
Here is a link to the documentation.
Are you sure that the KB article that you are viewing really has no Short description (meaning the field is actually empty on the kb_knowledge record)? That should not be possible because this is a mandatory field.
Another note is that dumping data in the UI is not the typical approach for debugging a Widget.
Usually you would invoke the "Log to console" debug functionality (RIGHT CLICK on the widget while pressing the CTRL key) to review the live content of the "data" object in the browser console.
Regards,
Robert
Thank you for the tip on Angular - it's not something I'm well-versed in, but at least I know that's where I need to go for help (I assumed it was a ServiceNow thing).
I wasn't aware of the logging function. I tried it and it has two choices: $scope.data and $scope. When I try it, I see data that appears to be related to the widget and not my code:
I'm certainly open to better ways to debug, but what I don't understand is how I have two lines of code that couldn't be simpler, but act in such a mystifying way. One sets the short description from the knowledgeRecord variable (which is used for the title of the article and works fine), and the next stores that same variable on the very next line (which shows that the short description used on the previous line doesn't actually exist). But it MUST exist since the data.shortDesc has a value. How can I debug this?
Hello @jeremyduffy ,
You need to use the "Log to console: $scope.data" option.
It won't show your code. It will show you the properties of the "data" object so that you can verify if they have the expected values.
But you need to do that while right-clicking on your widget on an actual portal page as shown in my screen shot. It seems you right-clicked on the widget editor (which is a widget itself).
The reason why your "stuff" object appears to have empty properties is that you have assigned the "knowledgeRecord" object to it, which is a GlideRecord Java object and not a native JavaScript object. So "knowledgeRecord.short_description" is not a string but a GlideElement Java object, which cannot be "stringified" to JSON (which is what happens when you add {{data.stuff}} to the HTML template) and that's why you just see the "empty object" / {}.
On the other hand, "data.shortDesc" has a value that AngularJS can work with, because your code casts it to an actual JavaScript string by adding the "".
knowledgeRecord.short_description.getDisplayValue() + "";
You still have not clarified what's the actual issue you are trying to debug. You mention that the short description / title "works fine", so what is not working?
Regards,
Robert
