title: How to apply min/max attribute to v-model in Vue?
body: <p>Current constraint of <code>min</code> and <code>max</code> are not respected due to the way <code>v-on</code> is implemented:</p>
  
  <pre><code>&lt;input id="passwordLength"
         class="form-control form-control-sm"
         type="number"
         min="5"
         max="35"
         v-model="options.length"&gt;
  &lt;span class="input-group-btn" v-on:click="options.length+=1"&gt;
    &lt;button class="btn btn-secondary" type="button"&gt;
      &lt;i class="fa fa-plus"&gt;&lt;/i&gt;
    &lt;/button&gt;
  &lt;/span&gt;
  </code></pre>
  
  <h3>Question</h3>
  
  <p>How can I respect the constrain and still keep an elegant implementation?</p>