title: How to disable a button in angular depending on changed informations received from JSON server
body: <p>I am using Nebular in my angular app.</p>
  
  <p>What I am doing is that a get the informations in my JSON-server.</p>
  
  <p>After that, I create a <code>nb-card</code> which contains all the informations that I received from the server in many nebular elements, like <code>nb-select</code>, <code>input</code>, <code>nb-checkbox</code> etc ...</p>
  
  <p>That's the result : </p>
  
  <p><a href="https://i.stack.imgur.com/BeZq5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BeZq5.png" alt="enter image description here"></a></p>
  
  <p>As you can see I have a button <code>UPDATE</code>.
  I want is this button to be disabled when the informations are not changing. </p>
  
  <p>So the button has to be disabled when the page is loaded, but after at least one change ( for example I change the sport, or I unselect one checkbox ), the button should be clickable because I changed something.</p>
  
  <p>The HTML :</p>
  
  <pre><code>&lt;h1&gt;PRICE RULES&lt;/h1&gt;
  &lt;button nbButton class="but" status='info'&gt;ADD&lt;/button&gt;&lt;br&gt;&lt;br&gt;
  &lt;div *ngIf='priceRules'&gt;
      &lt;nb-card *ngFor='let pricerule of priceRules' style="float:left"&gt;
          &lt;nb-card-header&gt;{{ pricerule.id }}&lt;/nb-card-header&gt;
          &lt;nb-card-body&gt;
              &lt;nb-select style="float:left" [(selected)]='pricerule.activity' placeholder='Activity' status='info'&gt;
                  &lt;nb-option value='Tennis'&gt;Tennis&lt;/nb-option&gt;
                  &lt;nb-option value='Badminton'&gt;Badminton&lt;/nb-option&gt;
                  &lt;nb-option value='Squash'&gt;Squash&lt;/nb-option&gt;
                  &lt;nb-option value='Paddle'&gt;Paddle&lt;/nb-option&gt;
              &lt;/nb-select&gt;
              &lt;nb-select style="float:right" [(selected)]="''+pricerule.duration" placeholder='Duration' status='info'&gt;
                  &lt;nb-option value="45"&gt;45&lt;/nb-option&gt;
                  &lt;nb-option value="60"&gt;60&lt;/nb-option&gt;
                  &lt;nb-option value='90'&gt;90&lt;/nb-option&gt;
              &lt;/nb-select&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;
              &lt;input type="text" nbInput status="info" shape="rectangle" placeholder="Price"/&gt;
              &lt;p style="float: right"&gt;{{ pricerule.currency}}&lt;/p&gt;&lt;br&gt;&lt;br&gt;
              &lt;div *ngFor="let day of pricerule.weekdays" &gt;
                  &lt;nb-checkbox style="display: inline-block" status="success" value="true"&gt;
                      {{weekdays[day]}}
                  &lt;/nb-checkbox&gt;&lt;br&gt;
              &lt;/div&gt;&lt;br&gt;
              &lt;nb-card-footer&gt;
                  &lt;button nbButton hero status="danger" (click)="delPriceRule()"&gt;DELETE&lt;/button&gt;
                  &lt;button nbButton hero status="success" style="float:right"&gt;UPDATE&lt;/button&gt;
              &lt;/nb-card-footer&gt;
          &lt;/nb-card-body&gt;
      &lt;/nb-card&gt;
  &lt;/div&gt;
  </code></pre>