AngularJS does not translate correctly with translate-value - javascript

I got a small problem with my I18n integration.
AngularJS seems to skip one translation in the whole page. Everything translates fine except for one tag.
I get my translations through JSON.
{
"password": {
"title": "Wachtwoord voor [<b>{{username}}</b>]",
"form": {
"button": "Opslaan"
},
"messages": {
"error": "<strong>Er is een fout opgetreden!</strong> Het wachtwoord kon niet worden veranderd.",
"success": "<strong>Wachtwoord veranderd!</strong>"
}
}
}
The line in the HTML:
<h2 translate="password.title" translate-values="{username: '{{account.login}}'}">Password for [<b>{{account.login}}</b>]</h2>
This just displays Password for [Admin].
The request for the password.json file contains exact the same as i stated above. The html contains this when inspected through the Chrome Console:
<h2 translate="password.title" translate-values="{username: 'admin'}" class="ng-scope">Password for [admin]</h2>
Everything else (Without those translate-values) translate fine. But this line doesnt. Why doesnt it work? The login name is correctly passed.
Thanks in advance.
Cheers!

If you use the translate directive, there is no need to add content inside the h2 tag. So, the following should work :
<h2 translate="password.title" translate-values="{username: '{{account.login}}'}"></h2>

Related

Is there a way to change a style/html on a specific tagged page on Tumblr blog?

I have a pretty good understanding of HTML & CSS, but I am having trouble with the Tag Page feature of tumblr. On my blog for every tagpage, I have a heading being grabbed from the name of the tag. I do not want to change the URL. I want to change the heading on the page, but that heading is being grabbed from the {tag}. The tag is vld. Instead of the page saying vld, I want it to say "All Designs". Pretty much overriding the {tag} for just the /tagged/vld tagpage. The TagPage code is:
{block:TagPage}
<div class="tagtitle">{tag}s</div>
{/block:TagPage}
For /tagged/vld, I want the heading on the page to be "All Designs" instead of "vld". how can I make this change for this specific tagpage?
I have tried
{block:TagPage}
<div class="tag" id="{Tag}">All Designs</div>
{/block:TagPage}
My code being:
{block:TagPage}
<div class="tagtitle" id="vld">All Designs</h2>
{/block:TagPage}
I have also tried
<script>
switch(window.location.pathname) {
case "/tagged/vld":
$('.tagtitle').text('All Designs');
break;
}
});
</script>
But neither of the methods have worked - everything is still showing the tag as the heading. You can see my blog at vintagelovedesigns.tumblr.com
OK, I have a test version working here using one of your themes:
https://madox-test.tumblr.com/tagged/vld
Your switch statement should be throwing an error as you have an additional closing bracket.
The script should look like this:
<script type="text/javascript">
$(document).ready(function(){ // if you are using jquery it is a good idea
// to wrap code in a document ready function
switch(window.location.pathname) {
case "/tagged/vld":
$('.tagtitle').text('All Designs');
break;
};
});
</script>
Hope this helps.

How to display broken HTML in react?

I will try to display the Email content using React. Sometime, I found that there is not closing HTML available.
Currently:
I am setting the HTML content using dangerouslySetInnerHTML() method
<div
dangerouslySetInnerHTML={{
__html: this.state.single_mail_data.message
}}
/>
I also find react-render-html package from the Internet. But, Somehow, I have no permission to install any package.
Can anybody help me to display that broken HTML in react?
Thanks
I found a workaround, it's not perfect but at least it wont raise errors, you can put the broken html into an iframe srcDoc:
<iframe title="test" srcDoc="<html><body>Hello, <b><a href='#'>world</b>" />
Since it's not fully supported on all browser make sure to add html5 srcdoc-polyfill.
Seeing to that would be the CLOSING tag of you string isn't a solution such as checking for the pressence of the desired string justified?
if(!this.state.single_mail_data.message.includes("</html>")){
this.setState(
{
single_mail_data : {
...this.state.single_mail_data,
message : message += "</html>"
}
}
});
}

Copy phonenumber with python

Im struggling with python3. I teached myself the basics. Now im learning webdriver and bs4. FUN!
I want to scrape the phonenumber of a page. In other cases i made a working script. But now im on a page that gives me a headache!
I think the problem is that the content is dynamicly loaded. (Its not on the pagesource)
This is the page: https://www.dnls.nl/locatie/diergaarde-blijdorp-rotterdam
There is a element with this text: Toon telefoonnummer. I can click it with:
driver.find_element_by_link_text("Toon telefoonnummer").click().
The phonenumber is visible but for my eyes only! Im trying to grab the number for hours now with xpath and css but i can't grab it!
In the pagesource i see this:
<div class="show_onclick">
<div class="text-center telephone-field"><a class="set-align" :href="'tel:'+project.contact_phone">{{project.contact_phone}}</a></div>
<div class="text-center">{{project.contact_textline}}</div>
</div>
This is my last code:
from selenium import webdriver
try:
#telefoonnummer
driver.find_element_by_link_text("Toon telefoonnummer").click() #This works
driver.implicitly_wait(5)
telefoonnummer = driver.find_element_by_xpath(".//*[#id='main-inner']/div[1]/div[1]/div/div[2]/ul[1]/li[3]/div/div[1]/a").text
print(telefoonnummer)
except:
print("")
Is there a way to scrape this kind of content?
UPDATE: i found the data in a javascript thats in the head of the pagesource. Its a massive javascript and it contains:
"contact_name":"Blijdorp Happenings","contact_phone":"010 4431415","contact_email":"sales#diergaardeblijdorp.nl"
What is my goal: I want to find the phonenumber, copy to phonenumber and safe it in a var 'telefoonnummer'
Kind Regards!

How do I unescape characters in my API response?

I have built an application that retrieves data from the WP Rest API V2 with AngularJS. The response contains escaped characters like the one below:
"excerpt": {
"rendered": "<p>Når vi handler ind, støder vi på mange forskellige mærkningsordninger, og det kan ofte være svært at finde ud af, hvad de forskellige typer betyder. For at give dig svar på…</p>\n",
"protected": false
},
Is there a way unescape the character in Angular? I have looked at multiple options but none seem to work.
The data is displayed in my view like this:
<div class="titlepane">
<h4 class="posttitle white">
{{posts.title.rendered}}
</h4>
<h4 class="categorytitle white">
{{categories.name}}
</h4>
</div>
You can see the result in the image where the escaped character is shown.
How do I solve this?
I figured it out from another thread. The answer is to use the ng-html-bind.
Like the following:
<h2 class="post__title" ng-bind-html="post.title.rendered"></h2
Then it will show as it is supposed to.

Flowplayer playlist plugin issues with special characters in title

I have a playlist for the flowplayer on the page. I am having problems with tracks having titles that include special characters. Currently I have the code below that works fine:
$(function(){
$f("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf", {
clip: {
baseUrl: "http://localhost/gbc/"
},
playlist: [
{ url: "media/20140724_agoodsong.mp3",
name: "20140724_agoodsong.mp3",
title: "this title works",
class: "audio",
id: "3"
}
]
});
$f("player").playlist("div.playlist:first", {loop:true});
});
However, the second I put a special character in the title it does not work such as title: "this doesn't work". There are no errors that I can tell; there's nothing in the developer tools console or in the Apache server logs. Everything displays fine, just when I click on the song to play the player goes black and nothing happens. I have tried putting back slashes in front of it to escape it like this title: "this still doesn\'t work" but it does not change anything. That's what made me think it has something to do with the way the Flowplayer Playlist plugin handles it. Since it takes those values in the JavaScript and inserts them into a template in the html like the following:
<div class="playlist">
<ul class="${class}">
<li>
<img data-name="${name}" class="audio" src="images/delete.png" id="${id}" />
<a href="${url}">
${title}
</a>
</li>
</ul>
</div>
Here is a FIDDLE that shows the problem. Currently it works, but add a special character of any kind in the title and it stops working. Even adding html codes like ' for an apostrophe stops it from working.
Does anyone know how I can include a title that has special characters?
So I ended up getting it to work by escaping the special characters with unicode. So for an apostrophe I used \u2019 in this case.
$(function(){
$f("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf", {
clip: {
baseUrl: "http://localhost/gbc/"
},
playlist: [
{ url: "media/20140724_agoodsong.mp3",
name: "20140724_agoodsong.mp3",
title: "this title work\u2019s",
class: "audio",
id: "3"
}
]
});
$f("player").playlist("div.playlist:first", {loop:true});
});
You can see the above code working in this FIDDLE.
While that fixed my initial problem, these titles are user inputs in my case so I had to find a way to find and convert the special characters to their unicode equivalents. After much googling I didn't really find anything that was concrete so I tried a different approach. I did away with using the template that the flowplayer documentation uses and just printed the playlist out in the html myself. So now in the JavaScript I just set the base url for flowplayer and instantiate the playlist plugin.
$f("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf", {
clip: {
baseUrl: 'http://localhost/gbc/'
}
});
$f("player").playlist("div.playlist:first", {loop:true});
And then in my PHP script I loop through and create each playlist item myself using the same format as the template I started with.
while ($row = mysqli_fetch_assoc($result))
{
$id = $row['id'];
$name = $row['name'];
$title = stripslashes($row['title']);
$type = $row['type'];
$class = "audio";
if (strpos($type,'video') !== false) {
$class = "video";
}
print "<ul class='$class'>
<li>
<img data-name='$name' class='deleteAudio' src='images/delete.png' id='$id' />
<a href='media/$name'>
$title
</a>
</li>
</ul>";
}
And then in the page file I just include this script to print out the playlist.
<div class="playlist">
<?php include "phpscripts/getAudio.php"; ?>
</div>
Not sure if this is the best way to do it, but it worked for me! Hopefully this will save someone else some time and frustration.

Categories

Resources