Javascript Angular2：尝试从单击输入表单旁边的按钮的onclick函数更改标签_Javascript_Html_Angular

Javascript Angular2：尝试从单击输入表单旁边的按钮的onclick函数更改标签

javascript html angular

Javascript Angular2：尝试从单击输入表单旁边的按钮的onclick函数更改标签,javascript,html,angular,Javascript,Html,Angular,我试图更改的网页截图：当我点击“点击此处投标”按钮时，我试图将“0”改为“4534534” 是完整的项目代码（不含节点\模块文件夹）这是.ts文件代码 import {Component, OnInit} from 'angular2/core'; import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router'; import {Hero} from './hero'; import {HeroService} from './

我试图更改的网页截图：

当我点击“点击此处投标”按钮时，我试图将“0”改为“4534534”

是完整的项目代码（不含节点\模块文件夹）

这是.ts文件代码

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;
   }
}

下面是.html文件中我真正想要更改的唯一部分：

 Bid slot 1: <p> {{slot1}}</p>
          <p>



          </p>
            <form>


  <form>
        <label for="name">Enter your bid: </label>
        <input type="number" class="form-control" required>
            <button onclick=myFunction(slot1)>Click here to bid.</button>

Bid slot 1:{{slot1}


输入您的出价：
点击这里出价。

以下是.html代码：

<html>
   <center>
      <h3>Bidding Page</h3>
   </center>
   <p>
   </p>
   <p>
   </p>
   <form>
   <img src="http://weknowyourdreamz.com/images/apple/apple-05.jpg" alt="Apple" style="width:100px;height:100px;">
   <p>
   </p>
   <label for="name">Apple </label>
   <p>
   </p>
   <label for="name">Original Price: $1.00 </label>
   <p>
   </p>
   Description of item’s current condition:
   <p>
   </p>
   <label for="name">Description of item’s current condition: </label>
   <label for="name">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.</label>
   <p>
   </p>
   <form>
   <label for="name">
      Time left on auction:
      <input type="number" class="form-control" required>
      <p>
      </p>
      <form>
   <label for="name">Starting bid:</label>
   <input type="number" class="form-control" required>
   <p>
   </p>
   <label for="name">Number of bids so far: </label>
   <label for="name">{{numberofbids}}</label>
   <p>
   </p>
   Bid slot 1: 
   <p> {{slot1}}</p>
   <p>
   </p>
   <form>
   <form>
   <label for="name">Enter your bid: </label>
   <input type="number" class="form-control" required>
   <button onclick=myFunction(slot1)>Click here to bid.</button>
   <p>
   </p>
   <button>Click here to return to the top.</button>




<!-- 
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
-->


投标页






苹果


原价：$1.00


项目当前状态的说明：


项目当前状态的说明：
苹果是苹果树上的肉质果实。
它在蔷薇科的苹果属植物中。
苹果是最成熟的果树之一。它生长在果园里。


拍卖剩余时间：


起价：


迄今为止的投标数量：
{{numberofbids}}


投标时段1：
{{slot1}}


输入您的出价：
点击这里出价。


单击此处返回顶部。

如果使用角度2

使用

（单击）=“myFunction（slot1）”

而不是

“onclick=myFunction（slot1）”

加上

如果像这样将参数slot 1传递给myFunction（slot1），然后函数应该接受该参数

slot1 = 0;
myFunction(slotvalue) 
   {
         this.slot1 = slotvalue;
   }

如果您使用angular 2

使用

（单击）=“myFunction（slot1）”

而不是

“onclick=myFunction（slot1）”

加上

如果像这样将参数slot 1传递给myFunction（slot1），然后函数应该接受该参数

slot1 = 0;
myFunction(slotvalue) 
   {
         this.slot1 = slotvalue;
   }

希望这有助于

因为我假设您希望将按钮单击时的数字字段值作为参数发送，所以基本上对于这种方法，您必须定义局部变量，并将该变量的值作为参数发送，如下所示：-

<label for="name">Enter your bid: </label>
<input type="number" #bid class="form-control" required>

<button (click)='myFunction(bid.value)'>Click here to bid.</button>
[or you can also use `on-click="myFunction(bid.value)"` both are same]

slot1 = 0;
myFunction(slotvalue) 
 {
        this.slot1 = slotvalue;
 }

<label for="name">Enter your bid: </label>
<input type="number" #bid class="form-control" required>

<button (click)='myFunction(bid.value)'>Click here to bid.</button>
[or you can also use `on-click="myFunction(bid.value)"` both are same]

slot1 = 0;
myFunction(slotvalue) 
 {
        this.slot1 = slotvalue;
 }