Attribute(s) for a polymer element can be defined as attributes="toggle-foo", defaulted within the Polymer definition as 'toggle-foo':false and used elsewhere in the Polymer definition like if( this['toggle-foo'] ){...}. How can hyphenated attribute names be used within the template?
I have tried the following:
<template if="{{toggle-foo}}">
<template if="{{this['toggle-foo']}}">
<template if="{{'toggle-foo'}}">
Related
I have a view where there was a file type field. So I added it to the view and rewrote the result for it:
{{ title }}
The above line results in an a tag with the href for the PDF document and the node title as text for the tag.
Now I have replaced the field field_download with the field field_mdownload which is a reference to an entity of type Media document. I can't get the same result with this type of field.
I tried using Twig Twaek and Bamboo Twig for this purpose, and tried direct access to node and content too, but it doesn't seem to work in the context of the view.
I tried to use things like:
node.fileld_mdocument.entity.media_file_document.uri.value
node.field_mdocument | file_uri
field_mdocument | file_uri
file_url (field_mdocument)
<% set node = bamboo_load_entity ('node', nid)%> but here twig doesn't seem to be able to convert the nid to the entire value that represents the node. If I put <% set node = bamboo_load_entity ('node', 1)%> it works.
Does anyone have any idea how I can solve this?
In my React app I'm exporting a html table to Excel by saving the rendered html (which Excel knows how to open) to a file. I'm also trying to set 'mso-number-format' style property on each <td> to tell Excel what number format to use per cell. However, React doesn't like this code:
<td style={{ 'mso-number-format': '\\#' }}
In console it logs:
Unsupported style property mso-number-format. Did you mean msoNumberFormat? Check the render method of `ComponentX`.
Is there a way to get around this without traversing the DOM and manually do something like:
node.setAttribute('style', 'mso-number-format: \\#')
Styles attributes in React JSX are written in camelCase notation and not as you have defined. Define it like
<td style={{ 'msoNumberFormat': '\#' }}>
The docs in react says this
In React, inline styles are not specified as a string. Instead they
are specified with an object whose key is the camelCased version of
the style name, and whose value is the style's value, usually a string
Style keys are camelCased in order to be consistent with accessing the
properties on DOM nodes from JS (e.g. node.style.backgroundImage).
Vendor prefixes other than ms should begin with a capital letter. This
is why WebkitTransition has an uppercase "W".
Inline styles docs
as react suggests you to and it will solve your problem.
Also I think it should be a \# instead of \\# for text formatting.
You can also try it as
var styles = {
msoNumberFormat: '\#'
}
<td style={styles}>
I'm using handlebars with KeystoneJS and am trying to extend the main import in the default template. At the moment it only includes the {{{body}}} tag imported through the view plus the partials that I'm using.
Is there any way to add a couple of other imports (i.e. intro content, page title, additional scripts). In the jade version on the demo site it just imports it as a content block. Is this a limitation of handlebars?
You can do this with handlebars just fine using partials.
Put your partial in the folder indicated below:
Then in your layout ('default.hbs' in this case) reference the partial like you would normally in handlebars.
<div id="header">
{{> navigation this}}
</div>
The '>' means insert partial.
In this case 'navigation' is the
partial name in the partials folder.
'this' is the data context. Its what you want to do with the 'locals.data' object passed into handlebars by keystone. Using 'this' will pass the whole lot through whereas doing something like 'locals.data.navigation' would pass the navigation object through to the partial making it directly accessible in the partial (good for DRY).
Hope that helps. The partials specific documentiation for handlebars is here if you are interested in looking into a few more things you can do with scope etc http://handlebarsjs.com/partials.html
Lets say I have a custom element defined as
<polymer-element name="my-elem" >
<template if={{show_is_in_my_declaration?}}>
....
</template>
<script>
Polymer('my-elem', {});
</script>
To use it I would like to declare it as...
<my-elem show></my-elem>
Where including 'show', makes the template appear; similar to how things like 'flex' or 'fit' effect the element. What is this called and how do I implement it.
note: I don't want to write something like show="{{true}}"
It's called Conditional Templates.
Here is the docs:
https://www.polymer-project.org/docs/polymer/template.html#if
and here are some examples on how to use them:
https://github.com/Polymer/TemplateBinding/tree/master/examples/how_to
In my Thymeleaf template I need to set a custom attribute to a dynamically generated value. How would I do that?
I tried th:attr="name=value", but it seems to be pretty much strict about the 'value' part. For instance, I tried to generate the following attribute:
<div ng-init="myUrl='http://myhost.com/something'> ... </div>
where http://myhost.com/something is a dynamic part of the ng-init attrubute and is generated by Thymeleaf's URL expression, like #{...}
Any suggestions how to compose an expression that would produce the above piece of HTML?
Give this a try:
<div th:attr="ng-init='myUrl=\'' + #{http://myhost.com/something} + '\''">...</div>
It will output:
<div ng-init="myUrl='http://myhost.com/something'">...</div>