title: Store images in firebase storage and data in firestore
body: <p>I'm using Angular 8 + Firestore(cloud firestore, not realtime database) </p>
  
  <p>I want to select an image through input element and then upload it into firestore storage. All the other data will be stored in cloud firestore.</p>
  
  <p>How do I store image in storage and it's url in firestore?</p>
  
  <p>component.html</p>
  
  <pre><code>&lt;div class="form-group"&gt;
          &lt;input type="email" name="emailA" #emailA="ngModel" [(ngModel)]="service.formData.emailA" class="form-control" placeholder="e-mail" required&gt;
      &lt;/div&gt;
  
      &lt;div class="input-group mb-3"&gt;
          &lt;div class="input-group-prepend"&gt;
              &lt;span class="input-group-text" id="inputGroupFileAddon01"&gt;Upload&lt;/span&gt;
          &lt;/div&gt;
          &lt;div class="custom-file"&gt;
              &lt;input type="file" class="custom-file-input" name="imgurls" id="inputGroupFile01" aria-describedby="inputGroupFileAddon01"&gt;
              &lt;label class="custom-file-label" for="inputGroupFile01" &gt;Choose file&lt;/label&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;p style="color: red;" *ngIf="form.invalid &amp;&amp; form.touched"&gt; *All the fields are required &lt;/p&gt;
      &lt;div class="form-group"&gt;
          &lt;button type="submit" [disabled]="form.invalid" class="btn btn-block btn-primary"&gt;Submit&lt;/button&gt;
      &lt;/div&gt;
  
  </code></pre>
  
  <p>and this is my component.ts</p>
  
  <pre><code>onSubmit(form: NgForm) {
  
      let data = Object.assign({}, form.value);
      delete data.id;
  
      if (form.value.id == null) {
  
        this.firestore.collection('lecturers').add(data);
      }
      else {
        this.firestore.doc('lecturers/' + form.value.id).update(data);
      }
      this.resetForm(form);
      this.toastr.success('Lecturer saved successfully!', 'Lecturer Details');
  
  
    }
  </code></pre>