Question

我是angular的新手，先生给我练习，通过使用angular 7单击按钮来获取p元素中的输入字段数据。我使用某些功能（onClick，onClickSubmit，myFunction）做了很多尝试，但是我失败了每次尝试。我认为我在数据绑定/事件绑定中遇到问题。请帮助我解决此问题。

app.component.html ：

<input type="text" [(ngModel)]="name" name="name">
<br><br>
<button (Click)="onClick">Show</button>
<p>{{name}}</p>

app.component.ts ：

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'angular7-app';

    show(){
        this.show =
    }
}

Answer 1

尝试这样：

Working Demo

.html

<input type="text" [(ngModel)]="name" name="name">
<br>
<br>
<button (click)="show = true">Show</button>
<p *ngIf="show">{{name}}</p>

Answer 2

只需将输入值保存到一个临时变量中，然后单击即可将其复制到显示中。

app.component.ts ：

EJB

app.component.html ：

@stateless

通过单击按钮获取输入字段数据，并在angular7中的p元素中获取值

2 个答案: