I have a polymer component with an HTML file which contains an anchor element <a href="foo">. This component is then imported with HTML import. The polymer transformer (or maybe the web_components transformer) will inline this import, and when doing so it will rewrite my anchor element to <a href=/path/where/the/html/file/exists/foo">.
Now I want to use the anchor tag to do client-side routing. I have a route set up as "foo" but when the transformer has rewritten the href that route will not work. So what I want is for the transformer to leave my href alone and just keep the original path. I tried using _href but that gives an error that it should only be used with bindings. So I guess my question is if there is any way to instruct the transformer to leave my hrefs alone?
This might work:
<a _href="{{'foo'}}">
Related
I am trying to learn iMacros (and avoid jscript or vbscript IF possible). I was reading any resource i could find since yesterday and the imacros reference does not have any helpful example of what i need.
All the methods I tried, will extract either the TXT or the HTM content of an element. My problem is that i have a div like this
<div class="cust_div" id="Customer_45621">
...content in here...
</div>
And the part i need to extract is 45621 which is the only dynamic part of the id attribute.
For example, between 3 customers, it could be
Customer_45621
Customer_35123
Customer_85663
All I need is the number. Thanks.
The solution is
TAG POS=1 TYPE=DIV ATTR=cust_div EXTRACT=HTM
Then you have to use EVAL and use in it JS scripting to extract the id. That is the only way. You can't cut the HTML code without JS, but you can use JS in iMacros with EVAL.
I want to loop over all children of a custom polymer element - for instance, to place each child in a new div.
<template repeat="{{child in children}}">
<div>
{{child}}
</div>
</template>
When I try this, I get the toString() version of child, rather than the element itself. Is there a way to reference the element itself inside the repeat, rather than the result of its toString() method?
Update
A ready-to-use element for Dart Polymer 1.0 is bwu-bind-html
This is not supported. Moustache binding can't insert HTML.
What you can do though is to use a Polymer element that provides that feature.
Please have look at my answer to HTML Tags Within Internationalized Strings In Polymer.dart <safe-html>.
With this element your code would look like:
<template repeat="{{child in children}}">
<div>
<safe-html model="{{child}}"></safe-html>
</div>
</template>
You might need to customize the NodeValidator construction which defines what kind of Elements are allowed to be added.
This feature might pose security risks (XSS) and is therefore not included in Polymer by default.
I have a html content stored in backend, which may have certain anchor tags with href links, when rendering them I build a custom NodeValidator and then bind the value using a angular.dart decorator. Some of the href links points to outside my domain, I want to make sure that target='_blank' is added as attribute to such anchor tags so that browsers open the link in a new tab. Can this be taken care of by some UriPolicy or custom NodeValidator?
I need to add an attribute in with in div tag in thymleaf as follows
<div class="mp_snippet_address" itemscope itemtype="http://schema.org/LocalBusiness">
the problem is i could not define the itemscope in div tag
The standard HTML parser in Thymeleaf is a very strict XML parser. You can switch to the less-strict LEGACYHTML5 template mode (then include the nekoHTML 1.9.15+ as a dependency), which allows for 'boolean attributes', but the output may be slightly different than the input templates as I think it performs some kind of tag balancing to massage HTML5 into being well-formed XML.
Support for HTML as per the HTML spec is on the cards for Thymeleaf 3.0, but that version is still a very very very long way away.
For example, I have a piece of code like this:
String_test="
<template>
<label> {{count2}} SSSSSSSSSSSSSSSSSSSSSSSSS </label>
<input id="input1" type='text' value='{{count2}}'>
</template>"
and I want to assign String_test to another element, like:
DivElement span2 = new Element.tag("div");
span2.setInnerHtml(String_test);
_content.nodes.add(span2);
However, the "< template >' tag is not recognized, nothing will show up.
NOTE: My purpose is to use setInnerHtml to dynamically add contents to the webpage with data-binding still OK.
Any ideas?
Thanks!
It appears that you are including raw html in your Dart program files. This is not how Dart works. Dart has code (kept in .dart files) that is referenced to via a tag in the HTML file. This very quick tutorial will show you how to do that: https://www.dartlang.org/docs/tutorials/connect-dart-html/
Templating is found in the Dart Polymer library. It is too long of a process to go into here but you can find a short tutorial at: https://www.dartlang.org/docs/tutorials/polymer-intro/
I would also mention that Angular comes in a Dart flavor and I find it more accessible than the Polymer libraries. The tutorials and documentation are also much better. Angular is a more comprehensive suite of libraries and it's tutorials can be found here: https://github.com/angular/angular.dart.tutorial/wiki