I am very new to backbone.js and learning it. I managed to pass my variables to the view and they are being displayed fine. What I am struggling with is what if the variable being passed to the view is an html that looks like this
<p>I am an html print me on view</p> now suppose this variable is called description so inside the view if I do
<%-description %>
This actually displays the result in html as you can see in the following screenshot. So my question is how can i print a variable on view which is an html?
Any help will be greatly appreciated.
Have a look at _.template doc, it says
Template functions can both interpolate values, using <%= … %> [...] If you wish to interpolate a value, and have it be HTML-escaped, use <%- … %>
Use <%= description %> to insert the raw, unescaped HTML.
Related
Does Microdata work with dynamic Angular ng-repeat items?
Can I use it as:
<div itemscope itemtype="http://schema.org/Product" ng-repeat="item in items">
…
</div>
I have found schema validator which, for my site actually shows angular expressions:
...
datePublished {{lvl_project['year']}}
name "{{lvl_project['title']}}"
keywords {{lvl_project['tools'].join(',')}}
...
Furthermore, it does NOT show all of the ng-repeat-generated elements.
This seems to me like a strong indication that the google-bot did not see the angular-generated elements and their values, but there could be more to the issue that I don't know.
Yes, you can use...it will work on all (but use if all comes in same category).
I am using Underscore to create a template. I pass the models of a collection to the template, in this case a list of 'phone' objects.
Inside of the template, I define a function that, when called, creates a table row that includes a select that contains the phone numbers that can be chosen.
I have tried 'var phone = <%= phones %> inside the function. Didn't work.
Say the function is called 'create_select'. I have tried 'create_select(<%=phones %>) {}'. That didn't work either.
There might be other ways of doing this (for example, a create_select event handled in the Backbone View linked to this template) but I would like to understand, if this is not possible, why not.
You have to call it inside your script let tag .For accessing the value and pass it to a function.
Sample js fiddle for function inside a template
<% var x = people; disp(x); %>
<% function disp(x) { %>
<% _.each(x, function(name) { %>
<li><%= name %></li>
<% }); %>
<% } %>
In the sample code I am passing a json object and inside the template I have a function called disp(). I'm passing the value to the function and parsing it using _.each() function .
I'm inside my view.xthml which has facelets component in there. Like:
<ui:composition template="/layout.xhtml"> .. whatever
Being there I try to integrate AngualerJS, putting ng-view, like this:
<div ng-view> </div>
When my /view.jsf is rendering I got server side error:
Attribute name "ng-view" associated with an element type "div" must be followed by the ' = ' character.
So, it validates my html that prevents angular ng-view to start working.
The question is: how to integrate angularjs and its ng-view with jsf/facelets based on my case?
Facelets is a XML based view technology which uses XHTML to generate HTML output. In XML, each element attribute must have a value.
You can indeed assign it an empty string as value, but ng-view="true" or ng-view="ng-view" would be more self-documenting, keeping checked="checked" and selected="selected" in mind.
<div ng-view="true">
<div ng-view = "">
Looks not nice but it works for me on that stage (of getting rid of jsf).
I'm trying to use AngularJS built-in directives to achieve some simple JS effect without writing actual js code. It actually works pretty well, except the initial flash.
I know to deal with text, people should use ng-bind instead of {{}}
But how do you deal with directives like ng-if?
Here is my code:
<li ng-if="!magazines.resolved"> <!-- add "&& isOwner" when done -->
<dl>
<dt ng-model="changeToActivation" ng-init="changeToActivation=false" ng-mouseover="changeToActivation=true" ng-mouseleave="changeToActivation=false"><img ng-if="!changeToActivation" ng-src="<?php echo base_url('public/images/system_icons/add_magazine.jpg');?>">
<img ng-click="addMagazine()" id="activated" ng-if="changeToActivation" ng-src="<?php echo base_url('public/images/system_icons/add_magazine_activated.jpg');?>"></dt>
<dd class="magazineName">Create <br> A new magazine</dd>
<dd class="publishDate">Now!</dd>
</dl>
</li>
I know it gets a bit hard to read, but it's very easy. There is a model defined on <dt></dt> tag. If mouse is over this tag, the model value becomes true; when leaves, it becomes false.
Based on this boolean model value, one or the other image will be shown.
It works like a charm, but I can see both images at the very beginning, flashing!
How to deal with something like this then?
ngCloak may help, but you should also use ng-src for the actual image source, this will prevent your site from loading the image before the model has received a value. Also when using ngCloak, you may need to load the AngularJS source at the top of your html file as it may try to load the image before it knows what to do with the ng-cloak directive.
Applying ngCloak to you dt should do the trick for you: http://docs.angularjs.org/api/ng.directive:ngCloak
Here's an example from the docs. Note that it's added in two places- the directive as well as a class. The class is only needed for IE7 support.
<div id="template2" ng-cloak class="ng-cloak">{{ 'hello IE7' }}</div>
Im updating to rails 3 and experience the problem of writing the content of a array to a html view. If I just place the array like:
<%= array %>
It gets now outputed as:
["...","...","..."]
with rails 2 it was just the content which got printed...
Any Ideas?
Markus
<%= array.join ' ' %>
You can try using array#to_sentence method:
<%= array.to_sentence %>
Or just a join:
<%= array.join(", ") %>
Depends on how you want the output to look.
If it's for debugging purposes, why not try:
<%= debug array %>
if you need to present the array in a specific way, you're better off iterating the array and presenting each element with a repeatable block or a partial.