title: How to access component data with injected service without circular dependency?
body: <p>I have a component containing a form in its template and also a <a href="https://www.pluralsight.com/guides/how-to-implement-services-and-dependency-injection-angular" rel="nofollow noreferrer">service injected</a> in the component which would process the form data and handle an HTTP post to a back-end. I would like this service to access an object defined in my component class, since it would contain properties representing values from the form with two-way data binding (aka. <a href="https://akhromieiev.com/angular-banana-in-a-box-example/" rel="nofollow noreferrer">banana-in-a-box</a> method).</p>
  <p><a href="https://stackoverflow.com/questions/56975113/access-component-data-from-a-service">This stackoverflow post</a> recommends injecting the component as a dependency in the service, but since my service would be injected to the component already, it would create a circular dependency error, so it is clearly not the way to go.</p>
  <p>Is my approach correct by having a service for this use case or should I use a different design? If the former, how to implement without circular dependency error?</p>