ng-bind-html is empty - javascript

I've put a JSfiddle here so you can see code that is actually working...
http://jsfiddle.net/vtKqG/1/
Unfortunately this does not work on my local machine even though everything else does (I have other angular code running fine).
On my local machine I only see my html in the output if i use..
ng-bind-html-unsafe="message.content"
instead of...
ng-bind-html="message.content"
So, on JSfiddle it works when I leave the "unsafe" off, but on my local machine the unsafe has to be there, which seems undesirable from a security point of view.
I am loading the same version of Angular and sanitize, in the same order and my code I think is identical, only the environment seems to be different.
Any ideas?

You need to add your module to ng-app:
<html ng-app='myApp'>
...
If you don't specify this, angular will only load module 'ng', not ng-sanitize. ng-bind-unsafe is in module ng, not ng-sanitize, which is why this accidently worked.

Apparently in new version of AngularJS 1.2+ they change it, since then you have to use trustAsHtml() method to disable Html escaping.
Solution can be find here

Related

Confusing error with AngularJS: Multiple Directive Resource Contention

We are having an odd issue in our angular project. The project runs fine on my machine, but when it's run from the development server we get the following error:
Multiple directives [organizationConfiguration, organizationConfiguration] asking for new/isolated scope on: <organization-configuration ng-show="tab.id == 'organization'" organization="organization">
organizationConfiguration is an AngularJS component. The code that is causing the error is below:
<organization-configuration ng-show="tab.id == 'organization'"
organization="organization">
</organization-configuration>
I can't see anything wrong with the code and have no idea where the second scope is coming from. And like I said, the code runs fine on my local machine, but once Jenkins deploys it to the dev server it starts to break. We've been using Jenkins for years without issue so I doubt it's an issue with that.
Thanks
Did you miss to close the "organization-configuration" tag properly? I could see you give it as "/organization-configuration>" in the example.

How to avoid '#' sign expansion in `vega#3`

In an HTML script, a call to fetch a package ending in vega#n where n is a version number, is being incorrectly expanded and causing a 404 error. I'm trying to find out why, and to prevent this.
Apologies in advance for the long-winded explanation, but I'm not sure where the problem lies so I'm trying to be as specific as possible.
I'm following the user guide to try and load a vis into a jupyter notebook. This executes the script in-browser, I believe, but for some reason has support for requireJS, which means that global modules aren't correctly loaded when using the import method, which basically uses html's <script> tags to load the module.
This can be worked around by calling define, as described in a similar problem with D3, here: https://github.com/mpld3/mpld3/issues/33#issuecomment-32101013.
I've written this gist to show a working example:
https://gist.github.com/lJoublanc/439e2f687b7aedd6fbdea5adab5cee0f
However, for some reason (either requireJS or something else - my JS knowledge is limited), expands URLs of the form https://cdn.jsdelivr.net/npm/vega#3 into something like https://cdn.jsdelivr.net/npm/vega#3.js?v=20180324103700 which results in a 404 error.
Using the github URL (i.e. without the #3) works fine though.
Any idea if this is requireJS doing this, or the CDN? How would I work around it?

jQuery doesn't work properly after major renaming

I'm using jQuery 2.2.4. Everything was ok until I done a major renaming. I renamed the main object, from actual application name to "app". I also renamed other things, as I was changing my app name.
Unfortunately jQuery (minified) doesn't work properly now . I noticed it 2 days after. I spotted 2 weird errors. For example:
$('body').on('change','input:not(.error)', function() { });
When input is changed I get an error "cannot read property test of undefined". jQuery was concatenated with my application file. When I moved jQuery to a separate file I got "uncaught reference error: app is not defined" for that event.
I renamed my main object back from app to something specific, but it didn't have any effect. And development version of jQuery works fine. I can't run a diff, because I changed so many things. Either I will find what causes the issue, or I will have to revert and do everything again.
Does anyone know what might cause jQuery to break? I remind that it only doesn't work on the minified, development version of jQuery.

My easeljs project doesn't work online

I am developing a videogame using EaselJS, a Javascript library.
My project works pretty fine offine, or on a local server. However, when I try to upload it on a website (ex: http://streetfighterjs.lixter.com/ ), it doesn't work anymore : my sprites aren't loading, and nothing is shown in my canvas.
The strange thing is that I tried to use PreloadJS to preload my images, but it doesn't seems to work. I was wondering if anyone already had this kind of problem, and how did he made to fix it.
You only included easel.js and sound.js.
preload.js is missing. Therefore createjs.LoadQueue is undefined.
Just include preload.js and your code should work.
You need to include preloadjs in your head (or prefferably just after your footer element).
In my project right now, I have the following order and it works fine:
<script src="../js/vendor/easeljs-0.7.1.min.js"></script>
<script src="../js/vendor/soundjs-0.5.2.min.js"></script>
<script src="../js/vendor/preloadjs-0.4.1.min.js"></script>
You should check your console from time to time:
Which is occuring from this line:
Sounds like PreloadJS is not included, or not loaded. Can you provide
a link to the sample?
Source
You are getting a typeffor from perso1 which is undefined. I notice that you are creating your perso1 global variable, but you are not actually saying what perso1 is equal to. Well you might be later in the code, but when you are getting that typerror, perso1 is not yet set.
Currently, the issue with the site is that perso1 is undefined during your tick (deplacement function). This will happen as long as the first image (imgPerso1) is not loaded.
I am also seeing XMLHttpRequest errors in the console, indicating that something is attempting to load cross-domain. If your LoadQueue is causing this, then you might want to change it to load content using tag-based loading instead of XHR:
new createjs.LoadQueue(false);
A few miscellaneous notes:
1. You don't need to constantly call stage.update() when you make changes, because you have a ticker that will constantly update the stage for you.
2. You are still using the default timing mode for Ticker (timeout-based). There is no useRAF property in version 0.8.1 - instead set the timingMode of the Ticker:
createjs.Ticker.timingMode = createjs.Ticker.RAF;
Hope that helps.

Dojo with application/xml+xhtml content-type

How can I get Dojo Dijits (1.5.0, currently) to work with XHTML as application/xml+xhtml? It works if sent as text/html, but application/xml+xhtml is required.
This seems to be tied to dijit.form.DatePicker and a few others.
This isn't a matter of validating against W3C, it just plain doesn't work, at all.
Error: mismatched tag. Expected: </br>.
Source File:
Line: 5, Column: 54
Source Code:
><div class="dijitReset dijitValidationIcon"><br></div
JavaScript execution stops because of this error.
Obviously, I can recompile Dojo, and fix all of these individually, but this is a lot of work, and does not fix everything.
Once again, it works with text/html, but application/xml+xhtml is required.
This was fixed with the upcoming (as in this week) release of the Dojo Toolkit 1.5, but if you find the corresponding Dijit template in question, you can just change it to without any side effects.
Hope that helps.
I asked about the server side in case you were serving up your own build. Anyway, I know you don't want to do individual patches and rebuilds, but I think there is a solution where you can "patch" yet don't have to rebuild. Since the build internalizes the string into the function constructor, you can change it by using the extend functionality. In this case, for ValidationTextBox, you can do
dijit.form.ValidationTextBox.extend({
templateString: "<div>apple sauce</div>"
});
This will get all future instantiation of dijit.form.ValidationTextBox to use the new template string. Though this might not be ideal, but it might be the only way for you to fix this without rebuilding the entire thing. Probably something in the form of,
dojo.require("dijit.form.ValidationTextBox");
dojo.require("my.ValidationTextBoxFix");
Good luck.
in xhtml you should have
<br/>
or
<br></br>
but I'm curious: who requires xhtml and for what?

Categories