title: How to set input field attribute 'readonly' from Angular component
body: <p>I want to set 'readonly' property of quantity field during keypress on assetId field.</p>
  
  <pre><code> &lt;!-- Asset ID Field--&gt;
    &lt;div class="form-group"&gt;
       &lt;label for="Asset ID"&gt;Asset ID:&lt;/label&gt; 
        &lt;input autocomplete="off" type="text" class="form-control" id="assetId" name="assetId" formControlName="assetId" (keypress)="setAssetId()"&gt;
   &lt;/div&gt;
  
  &lt;!-- Quantity Field--&gt;
  &lt;div class="form-group"&gt;
    &lt;label for="Quantity"&gt;Quantity:&lt;/label&gt; 
    &lt;input autocomplete="off" type="text" class="form-control" id="quantity" name="quantity" formControlName="quantity"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is my angular function:</p>
  
  <pre><code>public setAssetId(){
     console.log('Key changed');
     this.form.controls['quantity'].patchValue(1);
     this.form.controls['quantity'].set('readonly'); // I want to something like that
  }
  </code></pre>
  
  <p>Please help me regarding this...</p>