title: disabled property of button binding not working angular 4
body: <p>Im curious on my syntax. </p>
  
  <p>By the documentation and examples I have found online, the button in my form should be disabled if my form is not valid. However the buttons disabled property is not affected by my form css logic. </p>
  
  <p>the html: </p>
  
  <pre><code> &lt;form (ngSubmit)="addcity()" #cityform ="ngForm"&gt;
        &lt;input type="text"
               placeholder="add a city"
               id="cityadd"
               name="cityadd"
               ngModel
               pattern="([A-Z][a-z]*(\s[A-Z][a-z]*)*)"
               #formcitycss ="ngModel"&gt;
        &lt;button type="submit" [disabled]="!formcitycss.valid" &gt;Add City&lt;/button&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>this should work but it isn't. What am I doing wrong as far as syntax because I feel like I am spot on</p>