I am using angular 1.5 and using translate to externalize my strings to a separate json file.
The translated strings sometimes fail to load and the path of the string is displayed instead.
ex: instead of displaying "Hello World" it displays something like "greet.hello".
This is not a regular occurrence and goes away when I refresh the page.
Not sure whether this is a file load issue.
Remove the single quote.
Its should be {{greet.hello | translate}}.
it's better practice to use directive.
Angular runs every single filter twice per $digest cycle once something has changed.
So you can do directive instead:
<h1 translate="{{greet.hello}}" ></h1>
Related
Could you explain me how to use Lodash _.template in order to get some value from script to .html file via {{data}} ?
For example:
In script.js I set some changes to my data object and in view.html. I want to get changed data with {{data}}
How to use lodash _.template() for this issue?
The lodash template function does not allow you to build templates from files (but you could do it when combined with Webpack). It has absolutely nothing to do with AngularJS templates. However in some situations it makes sense of using inside of AngularJS, like for example building a list of strings with a pattern or the like.
You compile a template string to a function you can call as often as you like with the values:
const executor = _.template("Hello <%= name %>, my old friend!");
console.log(executor({name: 'Alice'})); // Hello Alice, my old friend!
console.log(executor({name: 'Bob'})); // Hello Bob, my old friend!
You can also use conditional, loops, etc.: https://lodash.com/docs/4.17.15#template
I'm working with an existing codebase and I need to figure out how this works:
{{'some_variable' | translate}}
It seems to correlate to some_variable in an api call but I don't see it in the controller.
In this project you are using angular-translate...
This module offers you directive, filter and a service to add translation into your application...
In the example you gave you are using translate filter (if you are not familiar with the angular filters check out documentation)...
There are some options that how angular translate get your translations but at the end it will something like javascript object like this...
{
some_variable: 'Some Variable translation'
}
translate filter will take your input 'some_variable' and find value for it from given translations (if it cannot find anything it will return key itself)...
Im using $this->js(true, 'your js here');, but have a problem:
If certain conditions are met, i redirect page to something else, with js function like this:
top.location = "http://some-url.com?param1=AAA¶m2=BBBB"
but & character converts to: &
I know i can use $this->api->redirect('some-url', array('param1'=>AAA, 'param2'=>BBB));
But for some reasons i have to use js function, but only to write html characters properly.. How to acomplish this?
The proper way to do this:
if($condition){
$this->js(true)->univ()->location('http://some-url.com?param1=AAA¶m2=BBBB');
}
More information here: http://book.agiletoolkit.org/js/univ.html
I am adding images to divs with ng-repeat which works fine. The image location data is nested in an array. The images show up as expected. My partial looks like:
<div class="image-wrapper">
<img src={{item.user.img_src}}>
</div>
However, it appears the page is to attempting to retrieve the string before AngularJS is loaded. I get the following console warning:
GET http://localhost:3000/%7B%7Bitem.user.img_src%7D%7D 404 (Not Found)
How do I prevent this?
The src attribute is buggy when Angular markup is used. Use ngSrc instead of src.
Thus, <img ng-src="{{item.user.img_src}}">
When the browser first loads the page it sees your src exactly as you wrote it. It's not until Angular loads and processes the page that it updates your dynamic source. Neither of these is what you want to have happen (especially since you could accidentally create the bad empty src attribute). Instead, use ngSrc directive so that no src will be set until Angular has evaluated your expression:
http://docs.angularjs.org/api/ng/directive/ngSrc
Given:
Url - http://www.contoso.com/search.php?q={param} returns:
-html-
--body-
{...}
---div id='foo'-
----div id='page1'/-
----div id='page2'/-
----div id='page3'/-
----div id='pageN'/-
---/div-
{...}
--/body-
-/html-
Wanted:
The innerHtml of div id='foo' must be fetched by the client (i.e. Javascript).
It will be split into discrete items (i.e. div id='page1' to div id='pageN').
API Throttling prevents server-side code from pre-fetching the data, so the parsing and manipulation burden must be placed on the client.
Question:
Could Yahoo-Pipes help format the data for easier consumption?
The lack of a DOM parser gives me pause.
Are there any existing pipes that could serve as an example?
You can use the YQL module, which allows you to fetch arbitrary URLs and then parse them with XPath. A sample YQL query:
select * from html where url="http://finance.yahoo.com/q?s=yhoo" and
xpath='//div[#id="yfi_headlines"]/div[2]/ul/li/a'
Yes, it's doable with Y! Pipes. You only need two modules from the 'Operators section':
First "Sub Element" to get only the content.
Then just use the "Regex" module to extract the div content and get it through JSON from your site:
Search:
^.*?<div id="foo">(.*?)</div>.*?$
Replace:
$1