How can I concatenate a variable in a string that is used a Go template? This is the original line (from https://github.com/nginx-proxy/nginx-proxy/blob/master/nginx.tmpl):
{{ $host := trim $host }}
{{ $is_regexp := hasPrefix "~" $host }}
{{ $upstream_name := when $is_regexp (sha1 $host) $host }}
{{ $access_log := (or (and (not $.Env.DISABLE_ACCESS_LOGS) "access_log /var/log/nginx/access.log vhost;") "") }}
I am trying to use variable "host" in that string like this:
{{ $host := trim $host }}
{{ $is_regexp := hasPrefix "~" $host }}
{{ $upstream_name := when $is_regexp (sha1 $host) $host }}
{{ $access_log := (or (and (not $.Env.DISABLE_ACCESS_LOGS) "access_log /var/log/nginx/" + $host + "_access.log vhost;") "") }}
But I get this error:
Unable to parse template: template: nginx.tmpl:175: illegal number syntax: "+"
It works making use of printf
{{ $host := trim $host }}
{{ $is_regexp := hasPrefix "~" $host }}
{{ $upstream_name := when $is_regexp (sha1 $host) $host }}
{{ $access_log := (or (and (not $.Env.DISABLE_ACCESS_LOGS) (printf "%s%s%s" "access_log /var/log/nginx/vhosts/" $host "_access.log vhost;")) "") }}
Related
I am trying to create pagination component. For e.g if my API returns "pages": 9
For example, if I have 9 pages, I want to cut the list at 5 and add three dots like on the image. I want to be able to provide at which index I can cut the list. Whats the best way to do this? I am approaching this wrong?
<div v-for="index in pages" class="flex">
<button>{{index}}</button>
</div>
Assuming you receive cutIndex and apiPages as props to your component, then your template could look something like the following:
<div v-for="page in Math.min(cutIndex, apiPages)" class="flex">
<button>{{page}}</button>
</div>
<template v-if="cutIndex < apiPages">
<div class="flex">
<button>...</button>
</div>
<div class="flex">
<button>{{apiPages}}</button>
</div>
</template>
this code works for me, and here is the key part
<template>
...
<template v-for="index in pages"
v-if="(index < 4 || (length - index) < 3) || Math.abs(index - value) < 2">
<span v-if="index === (length - 2) && value < (length - 4)">
...
</span>
<button #click.prevent="updatePage(index)">
{{ index }}
</button>
<span v-if="(index === 3 && value > 5)">
...
</span>
</template>
...
</template>
the result:
<template>
<nav class="flex items-center justify-center" role="pagination">
<!-- go to previous page -->
<a :key="`${$route.name}-arrow-${value > 1 ? value - 1 : 1}`"
:href="getFullPath(value > 1 ? value - 1 : 1)"
:title="$t('previous_page')"
#click.prevent="updatePage(value > 1 ? value - 1 : 1)"
:disabled="value === 1"
class="arrow pop-btn default rounded-sm"
v-waves>
<i class="mdi-chevron-left mdi"></i>
</a>
<template v-for="index in length"
v-if="(index < 4 || (length - index) < 3) || Math.abs(index - value) < 2">
<span v-if="index === (length - 2) && value < (length - 4)">
...
</span>
<a :href="getFullPath(index)"
:title="$t('page_index', {index: index})"
#click.prevent="updatePage(index)"
class="pop-btn number default rounded-sm"
:class="{
'active': index === value
}"
v-waves>
{{ index }}
</a>
<span v-if="(index === 3 && value > 5)">
...
</span>
</template>
<!-- go to next page -->
<a :href="getFullPath(value === length ? value : value + 1)"
:title="$t('next_page')"
#click.prevent="updatePage(value === length ? value : value + 1)"
:disabled="value === length"
class="arrow pop-btn default rounded-sm"
v-waves>
<i class="mdi-chevron-right mdi"></i>
</a>
</nav>
</template>
<script type="text/javascript">
export default{
emits: ['update:value],
props: {
length: {
required: true,
type: Number
},
// the page filter
value: {
required: true,
type: Number
}
},
methods: {
updatePage(index){
this.$emit('update:value', index);
},
getFullPath(page){
let query = {...this.$route.query};
page === 1 ? delete query.page : query.page = page;
return this.$router.resolve(
this.r({
query: query,
name: this.$route.name,
params: this.$route.params
})
).href;
}
}
}
</script>
by the way, <a> may better than <button> for SEO
I am trying to show a material table for a database object that repeats its IDs.
<md-table v-model="data">
<md-table-toolbar>
<div class="md-toolbar-section-start">
<h1 class="md-title">MyTitle</h1>
</div>
<md-field md-clearable class="md-toolbar-section-end">
<md-input placeholder="Search..." v-model="search" #input="searchOnTable" />
</md-field>
</md-table-toolbar>
<md-table-empty-state
:md-label="grid.length < 1 ? 'Nothing here yet' : `No users with the term '${search}' found`">
</md-table-empty-state>
<md-table-row slot="md-table-row" slot-scope="{ item }" v-bind:key="`row-${item.id}-${data.indexOf(item)}`" :class="getClass(item)" md-selectable="single">
<md-table-cell md-label="ID" v-if="user.role === 1" :key="data.indexOf(item)">{{item.id}}</md-table-cell>
<md-table-cell md-label="Name">{{item.name}}</md-table-cell>
<md-table-cell md-label="Type">{{item.type}}</md-table-cell>
<md-table-cell md-label="User" v-if="user.role === 1">
<span>
<span v-if="user.role === 1 && !item.nameUser">
-
</span>
<span v-if="item.nameUser">
{{item.nameUser}}
</span>
</span>
</md-table-cell>
<md-table-cell md-label="Status">
<span>
{{getStatus(item.status)}}
</span>
</md-table-cell>
<md-table-cell md-label="">
<span>
<md-button #click="start(item.id)" v-if="!item.status">
HandleEval
</md-button>
<md-button :to="`/final/${item.id}`" v-else-if="(item.status === 2 || item.status === 3) && user.role === 1">
FinishEval
</md-button>
<md-button :to="(eval_fase == 8) ? `/fase2/${item.id}/${item.user_evaluator_id}` : (eval_fase == 4) ? `/fin/${item.id}` : `/ev/${item.id}`" v-else-if="item.status === 8 || item.status === 1">
Continuar avaliação
</md-button>
<md-button #click="remove(item.id)" v-if="!item.status || ((item.status === 2 || item.status === 3) && user.role === 1) || (item.status === 8 || item.status === 1)">
<md-icon>delete</md-icon>
</md-button>
</span>
</md-table-cell>
</md-table-row>
</md-table>
The problem is when i access that page, i get this error:
vue.runtime.esm.js?2b0e:619 [Vue warn]: Duplicate keys detected: '62'. This may cause an update error.
found in
---> at src/components/MdTable/MdTable.vue
at src/components/Grid.vue
at src/components/MdContent/MdContent.vue
at src/components/MdApp/MdAppContent.vue
at src/components/MdApp/MdAppSideDrawer.vue
at src/views/Grid.vue
at src/App.vue
data looks like that:
[
{"date":"Thu, 10 Jun 2021 19:04:14 GMT","some_id":106,"id":210,"name":null,"nameUser":"Test","stage":null,"status":1,"status_form":0,"type":"compreensive","user_id2":4,"user_id":212},
{"date":"Thu, 10 Jun 2021 19:04:14 GMT","some_id":107,"id":210,"name":null,"nameUser":"Option","stage":null,"status":1,"status_form":0,"type":"compreensive","user_id2":13,"user_id":212},
{"date":"Thu, 10 Jun 2021 19:04:14 GMT","some_id":108,"id":210,"name":null,"nameUser":"Test2","stage":null,"status":1,"status_form":0,"type":"compreensive","user_id2":20,"user_id":212},
{"date":"Thu, 10 Jun 2021 19:04:14 GMT","some_id":109,"id":210,"name":null,"nameUser":"Tester","stage":null,"status":1,"status_form":0,"type":"compreensive","user_id2":61,"user_id":212},
]
Based on this line and this one in source code, Try out md-model-id="some_id"
<md-table v-model="data" md-model-id="some_id">
since this prop takes id by default value which also used as key, in your case id has the same value.
So i am trying to nest 2 variables in a url_for to pull a specific persons photo.
This is my code
<img
class="imgContainer"
src="{{ url_for('static', filename='players/_{{player.username}}_.png') }}"
/>
My images are of the form 'username.png' so thats why I put the '_' at the beginning and end.
This is the Python part of it:
#app.route("/<username>")
def player(username):
player = Player.query.filter_by(username=username).first()
return render_template("player.html",player=player)
What I tried:
{{ url_for('static', filename='players/_[player][username]_.png') }}
{{ url_for('static', filename='players/_player[username]_.png') }}
When setting up your url_for, it's already contained in the {{ }}. So, you can break up your string + variables like this:
<img class="imgContainer"
src="{{ url_for('static', filename='players/_' ~ player.username ~ '_.png') }}" />
Note the use of ~ to concatenate your variable and string within the {{ }} syntax. Using the ~ will convert your values to string first. If you know your variable types you can use +.
You can just concatenate the string using + as you would in Python.
Before:
src="{{ url_for('static', filename='players/_{{player.username}}_.png') }}"
After:
src="{{ url_for('static', filename='players/' + player.username + '.png') }}"
I'm using Shopify variables to try and push data through the Data Layer to use in Schema on particular pages. I used a Snippet to do this:
<!-- GTM Product Information via Data Layer -->
{% if product.url contains 'products' %}
{%- assign current_variant = product.selected_or_first_available_variant -%}
<script>
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'gtm_product_url': '{{ product.url }}',
'gtm_product_title' : '{{ product.title }}',
'gtm_product_image' : '{{ product.featured_image }}',
'gtm_product_description' : '{{ product.description | strip_html | strip_newlines | replace: '"', '' }}',
'gtm_date' : '{{'now' | date: '%Y-%m-%d' }}',
'gtm_sku' : '{{ current_variant.sku }}'
});
</script>
{% endif %}
{% if page.url contains 'pages' %}
<script>
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'gtm_page_title': '{{ page.title }}',
'gtm_page_published': {{ page.published_at }},
'gtm_page_image' : {{ page_image | img_url }},
'gtm_page_description' : {{ page_description }}
});
</script>
{% endif %}
I added the Variables in Google Tag Manager. The data shows up on the pages just fine (using the Shopify variables). And the product pages are actually pushing the data to GTM.
My problem is with the 'pages'. I see the data on the pages from Shopify and I've added the Variables into GTM, but they all show undefined when I try to add them to GTM.
I'm not sure what I'm doing wrong though. Any insights would be greatly appreciated!
You code works fine, but in case you had not noticed, you have not enclosed the values in quotes for the page section. You existing code without quotes throw
Uncaught SyntaxError: Unexpected token ':'
Wrapping quotes, it should work fine.
{% if page.url contains 'pages' %}
<script>
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'gtm_page_title': "{{ page.title }}",
'gtm_page_published': "{{ page.published_at }}",
'gtm_page_image' : "{{ page_image | img_url }}",
'gtm_page_description' : "{{ page_description }}"
});
</script>
{% endif %}
Moreover, console.log values for testing to see if you are receiving the expected values.
i'm pretty new to Shopify and I'm facing a strange issue in linklists.
Yesterday I changed the featured image for a category I displayed into a linklist, but I cannot see the changes in the page that prints the linklist.
I analyze the .liquid file that prints the linklists and I found the snippet that produces the divs:
{% for link in linklists[linklist].links cols: 4 %}
<div class="products item {{ link.handle }}">
<a href="{{ link.url }}" title="Browse our {{ link.object.title | escape }} collection.">
<img src="{{ link.object.image.src | collection_img_url: 'large' }}" alt="{{ link.object.title | escape }}" />
<big>{{ link.title }}</big>
</a>
</div>
{% endfor %}
After some shots I tried to add a data attribute to the image to print again the link.object.title:
{% for link in linklists[linklist].links cols: 4 %}
<div class="products item {{ link.handle }}">
<a href="{{ link.url }}" title="Browse our {{ link.object.title | escape }} collection.">
<img src="{{ link.object.image.src | collection_img_url: 'large' }}" alt="{{ link.object.title | escape }}" data-test="{{ link.object.image.src | collection_img_url: 'large' }}" />
<big>{{ link.title }}</big>
</a>
</div>
{% endfor %}
The strange fact is that it prints two different values for the same object!
<img src="https://cdn.shopify.com/s/files/1/0407/7545/files/trousers-woman_c4633f02-59f7-4a4b-809b-91662635ddc0.jpg?22734" alt="Women's Trousers" data-test="//cdn.shopify.com/s/files/1/0407/7545/collections/DSC_9685_grande_df826b7f-5645-4491-b866-8819c9ad8983_large.jpg?v=1429273629">
The src attribute shows the old image, and the test attribute shows the new one.
Is that because Shopify postprocess the src attributes of the image for caching them into their cdn? How can I fix this?
thanks to #Jason input I found a javascript script that changed the attribute "src" of the image:
$('.collection-woman .webshop .trousers a img').attr('src','https://cdn.shopify.com/s/files/1/0407/7545/collections/DSC_9685_grande_df826b7f-5645-4491-b866-8819c9ad8983_large.jpg?v=1429273629');