title: bootstrap 4 validation classes are not being displayed in input / feedback elements
body: <p>According to the <a href="https://getbootstrap.com/docs/4.0/components/forms/#validation" rel="nofollow noreferrer">bootstrap documentation</a>. The <a href="https://www.bootply.com/idq9FNY9KY" rel="nofollow noreferrer">following bootply markup</a> should contain green and red elements, <strong>moreover</strong> I am expecting the <code>invalid-feedback</code> messages to be displayed.</p>
  
  <p>I want to incorporate correct styles into an angular4 reactive form.</p>
  
  <pre><code>&lt;form class="was-validated"&gt;
      &lt;div class="form-group is-invalid"&gt;
          &lt;div class="input-group mb-3"&gt;
              &lt;span class="input-group-addon"&gt;@&lt;/span&gt;
              &lt;input type="text" class="form-control is-invalid" placeholder="Email" formcontrolname="email"&gt;
          &lt;/div&gt;
          &lt;div class="invalid-feedback"&gt;Shucks, check the formatting of that and try again.&lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group has-success"&gt;
          &lt;div class="input-group mb-3"&gt;
              &lt;span class="input-group-addon"&gt;@&lt;/span&gt;
              &lt;input type="text" class="form-control" placeholder="Email" formcontrolname="email"&gt;
          &lt;/div&gt;
          &lt;div class="invalid-feedback"&gt;Shucks, check the formatting of that and try again.&lt;/div&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I have applied the <code>.is-invalid</code> class to several elements, including the parent.</p>
  
  <p><strong>edit</strong>  </p>
  
  <p>I have found <strong><a href="https://github.com/twbs/bootstrap/issues/23454" rel="nofollow noreferrer">a bug logged</a></strong> for this.
  So in the spirit of stackoverflow, I am very happy to accept a workaround <code>(css)</code> answer  that either put's back all the old <code>has-*</code> classes, or works around the bug, extra awesome if it's angular 4 validation ready...</p>