Reputation: 538
<input type="text" placeholder="{{fromTimeWindow}}" v-model="fromTimeWindow"/>
or<input type="text" v-bind:placeholder="{{fromTimeWindow}}" v-model="fromTimeWindow"/>
both of the above above code gives me error. I want to use variable "fromTimeWindow" value as placeholder.
Upvotes: 5
Views: 18852
Reputation: 242
new Vue({
el: '#app',
data: () => {
return {
fromTimeWindow: 'Hey here is custom placeholder'
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<input type="text" :placeholder="fromTimeWindow" />
</div>
Upvotes: 3
Reputation: 3972
You dont have to {{ }}
since you are binding it to your placeholder. To solve that change your code to this.
<input type="text" :placeholder="fromTimeWindow" v-model="fromTimeWindow"/>
Upvotes: 9
Reputation: 538
Ahhh.. Got the answer from : Vue.js change placeholder of text input according to v-model value .
We need to use it like this:
<input type="text" :placeholder="[[fromTimeWindow]]" v-model="fromTimeWindow"/>
Upvotes: 1