title: Angular2: Trying to change a label from the onclick function of clicking a button next to an input form
body: <p>Screenshot of webpage I'm trying to change: </p>
  
  <p><a href="https://i.stack.imgur.com/Mc897.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Mc897.png" alt="Screenshot of webpage"></a></p>
  
  <p>I'm trying to change the "0" to "4534534" when I click the "Click here to bid" button.</p>
  
  <p><a href="https://www.dropbox.com/s/uyq3qeix1vpr8n1/ButtonError.zip?dl=0" rel="nofollow noreferrer">Here</a> is the full project code (without the nodes_modules folder).</p>
  
  <p>Here is the .ts file code</p>
  
  <pre><code>import {Component, OnInit} from 'angular2/core';
  import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
  import {Hero} from './hero';
  import {HeroService} from './hero.service';
  
  @Component({
  selector: 'BiddingPageComponent',
  templateUrl: 'app/BiddingPage.component.html',
  styleUrls: ['app/BiddingPage.component.css'],
  providers: [HeroService],
  directives: [ROUTER_DIRECTIVES]
  })
  
  export class BiddingPageComponent{
  
  slot1 = 0;
     myFunction() 
     {
           this.slot1 = this.slot1;
     }
  }
  </code></pre>
  
  <p>Here is the only part of the .html file that I actually want to change:</p>
  
  <pre><code> Bid slot 1: &lt;p&gt; {{slot1}}&lt;/p&gt;
            &lt;p&gt;
  
  
  
            &lt;/p&gt;
              &lt;form&gt;
  
  
    &lt;form&gt;
          &lt;label for="name"&gt;Enter your bid: &lt;/label&gt;
          &lt;input type="number" class="form-control" required&gt;
              &lt;button onclick=myFunction(slot1)&gt;Click here to bid.&lt;/button&gt;
  </code></pre>
  
  <p>Here is the .html code:</p>
  
  <pre><code>&lt;html&gt;
     &lt;center&gt;
        &lt;h3&gt;Bidding Page&lt;/h3&gt;
     &lt;/center&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;form&gt;
     &lt;img src="http://weknowyourdreamz.com/images/apple/apple-05.jpg" alt="Apple" style="width:100px;height:100px;"&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;label for="name"&gt;Apple &lt;/label&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;label for="name"&gt;Original Price: $1.00 &lt;/label&gt;
     &lt;p&gt;
     &lt;/p&gt;
     Description of item’s current condition:
     &lt;p&gt;
     &lt;/p&gt;
     &lt;label for="name"&gt;Description of item’s current condition: &lt;/label&gt;
     &lt;label for="name"&gt;The apple is a fleshy fruit from the apple tree. 
     It is in the species Malus domestica in the rose family Rosaceae. 
     The apple is one of the most grown tree fruits. It is grown in orchards.&lt;/label&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;form&gt;
     &lt;label for="name"&gt;
        Time left on auction:
        &lt;input type="number" class="form-control" required&gt;
        &lt;p&gt;
        &lt;/p&gt;
        &lt;form&gt;
     &lt;label for="name"&gt;Starting bid:&lt;/label&gt;
     &lt;input type="number" class="form-control" required&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;label for="name"&gt;Number of bids so far: &lt;/label&gt;
     &lt;label for="name"&gt;{{numberofbids}}&lt;/label&gt;
     &lt;p&gt;
     &lt;/p&gt;
     Bid slot 1: 
     &lt;p&gt; {{slot1}}&lt;/p&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;form&gt;
     &lt;form&gt;
     &lt;label for="name"&gt;Enter your bid: &lt;/label&gt;
     &lt;input type="number" class="form-control" required&gt;
     &lt;button onclick=myFunction(slot1)&gt;Click here to bid.&lt;/button&gt;
     &lt;p&gt;
     &lt;/p&gt;
     &lt;button&gt;Click here to return to the top.&lt;/button&gt;
  
  
  
  
  &lt;!-- 
  Copyright 2016 Google Inc. All Rights Reserved.
  Use of this source code is governed by an MIT-style license that
  can be found in the LICENSE file at http://angular.io/license
  --&gt;
  </code></pre>