I'm new to Vue.js 3 i18n and I havent been able to find an answer...
Does i18n support conditional statements inside translation keys?
Im migrating a website from Angular Js and I found conditional statements in the translations.
Here is an example: (Imagine everything with double moustaches for the AngularJs version)
"TIME": {
"COMPRESSED_FORMAT": "{d ? d + 'd' : ''} {h ? h + 'h' : ''} {m ? m + 'm' : ''} {s ? s + 's' : ''}"
},
I know THIS specific example could be implemented with pluralization, but I have other translations where is not possible...
Is there a way to express conditionals a translation in Vue.js i18n?
Cheers...
Related
I am new to Vue and I have to fix the following issue for work. I have a Bootstrap Vue b-form-checkbox-group similar to the one bellow. The listofOption comes from backend and from legacy databses. Sometime the ColumnName is empty or null. Right now it shows null or a blank space, but I want it to print the text "_blank" if that is the case.
<b-form-checkbox-group id="flavors"
v-model="status"
:options="listofOption"
:text-field="ColumnName"
:value-field="ColumnName"
name="flavors" class="ml-4" aria-label="Individual flavours" stacked>
</b-form-checkbox-group>
I have replaced the :text-field with the following line but can't make it work:
:text-field="[(ColumnName && ColumnName != null && ColumnName != '') ? ColumnName : '_blank']"
You could pass that value binding via function.
getColumnName(ColumnName) {
return (ColumnName && ColumnName != '') ? ColumnName : '_blank'
}
Then:
:text-field="getColumnName(ColumnName)
I have a <a> tag in my vue component & by checking some condition v-bind:href may differ. I have used ternary operator for it and in the else part I want to pass id with the url, but with not as part of url (like '/test/' +id). id should not be in the url. so how to do it?
This is how I tried for it & it giving me the compile error due to comma before id in else part,
<a v-bind:href="type === 'single' ? '/user/'+user.id+'/edit' : '/profile',user.id">
Url should be like "/profile"
I have resolved it as follows,
<a v-bind:href="type === 'single' ? '/user/'+user.id+'/edit' : '/profile?user_id='+user.id">
I'm learning Vue.js and found this fiddle that does exactly what I want to do.
Here is the fiddle: https://jsfiddle.net/os7hp1cy/48/
I integrated this and am getting this error:
invalid expression: v-for="user in users | filterBy searchKey | paginate"
So I've done some digging and I see it has changed from version 1 to 2. However, I don't know how to fix this.
<li v-for="user in users | filterBy searchKey | paginate">{{ user.name }}</li>
I would like to replace this with something that Vue 2 will support and will work the same way.
As of Vue version 2, filters can only be used inside text interpolations ({{ }} tags). See the documentation for migrating from Vue version 1.
You can use a computed property to filter the users and use that computed property in the v-for directive instead:
computed: {
filteredUsers: function() {
let key = this.searchKey.toUpperCase();
return this.users.filter((user) => {
return user.name.toUpperCase().indexOf(key) !== -1
})
},
paginatedUsers: function() {
var list = this.filteredUsers;
this.resultCount = list.length
if (this.currentPage >= this.totalPages) {
this.currentPage = this.totalPages
}
var index = this.currentPage * this.itemsPerPage
return list.slice(index - 1, index - 1 + this.itemsPerPage)
}
}
<li v-for="user in paginatedUsers">{{ user.name }}</li>
Also, when using v-for to generate a range of numbers like you do for your page numbers, Vue version to starts the index at 1 instead of 0. So, you'll need to update the logic depending on a starting index of 0 as well.
Here's a working fiddle.
Is there any way to provide the translate-default value while using the filter instead of directive?
e.g:
How to achieve the same results as this
<h3 translate="TEST" translate-default="Not present"></h3>
with filter format
{{ 'TEST' | translate }}
How do i put the "translate-default" attribute when using the translate filter?
What i need to do is show the original text if the key is not present.
I have created a wrapping filter for that purpose:
.filter('txf', ['$translate', ($translate: angular.translate.ITranslateService) => {
return (input: string, stringIfNotAvailable: string = '') => {
const translation = $translate.instant(input);
return translation === input ? stringIfNotAvailable : translation;
};
}]);
I'm trying to use the 'In' comparator with boto for specifying multiple locales on Mechanical Turk jobs. This answer says it's possible, as do the AMT docs.
I tried:
min_qualifications.add(
LocaleRequirement(
comparator='In',
required_to_preview=False,
locale=['US', 'CA', 'GB', 'IE', 'AU']))
I also tried, variously:
locale='US, CA, GB, IE, AU'
locale='US|CA|GB|IE|AU'
locale='US CA GB IE AU'
How is it done?
Just because something is possible in the mTurk API does not mean that Boto will support it. Boto has not been updated for this yet.
Here's how to do it with mturk-python:
import mturk
m = mturk.MechanicalTurk()
question = """
<QuestionForm xmlns="http://mechanicalturk.amazonaws.com/AWSMechanicalTurkDataSchemas/2005-10-01/QuestionForm.xsd">
<Question>
<QuestionIdentifier>answer</QuestionIdentifier>
<QuestionContent>
<Text>Hello world :^)</Text>
</QuestionContent>
<AnswerSpecification>
<FreeTextAnswer/>
</AnswerSpecification>
</Question>
</QuestionForm>
"""
qual = [
{'QualificationTypeId' : mturk.LOCALE,
'Comparator' : 'In',
'LocaleValue' : [{'Country':'GB'},{'Country':'US'},{'Country':'AU'}]},
]
reward = {'Amount' : 0, 'CurrencyCode' : 'USD'}
createhit = {"Title" : "Multiple locales",
"Description" : "https://github.com/ctrlcctrlv/mturk-python",
"Keywords" : "testing, one, two, three",
"Reward" : reward,
"Question" : question,
"QualificationRequirement" : qual,
"AssignmentDurationInSeconds" : 90,
"LifetimeInSeconds" : (60*60*24)}
r = m.create_request('CreateHIT', createhit)
print r
print m.flattened_parameters