Css 以angular2显示表格行上的加载消息 {{i}}--{{item.rollno} {{item.sname} {{item.status！='NOT'？item.status:''}}

每当我更改复选框时，我都会执行API请求，直到得到响应，我希望

禁用该行

或

显示在行上的加载

怎么做

我只想要一个而不是全部。怎么做

也许可以试试这个

在Html中：

  <tbody>
    <tr *ngFor="let item of  _studentList let i=index">
    <td  align='center'>{{ i }}--{{item.rollno}}</td>
    <td  align='center'>{{item.sname}}</td>
    <td  align='center'>{{item.status!='NOT'?item.status:''}}</td>
    <td  align='center'>
        <input type='checkbox'   style='height:15px; width:15px;' [checked]="item.status=='P'"  (change)="onChangePA(item)"  ></td>
  <td  align='center'>
   <a><img src='../images/d.jpg' height='30' width='30' /> </a>
 </td>
 </tr>
 </tbody>

也许试试这个

在Html中：

  <tbody>
    <tr *ngFor="let item of  _studentList let i=index">
    <td  align='center'>{{ i }}--{{item.rollno}}</td>
    <td  align='center'>{{item.sname}}</td>
    <td  align='center'>{{item.status!='NOT'?item.status:''}}</td>
    <td  align='center'>
        <input type='checkbox'   style='height:15px; width:15px;' [checked]="item.status=='P'"  (change)="onChangePA(item)"  ></td>
  <td  align='center'>
   <a><img src='../images/d.jpg' height='30' width='30' /> </a>
 </td>
 </tr>
 </tbody>

基本上，组件中需要有一个变量，用于通知模板api调用是已启动还是已完成

最初，“showLoading”将为false。在进行api调用时，将其设置为“true”。得到响应后，将其设置为“false”

在模板中，您将有一个类绑定“，如下所示-

export class YourComponent {

  isDisable = false;

  onClick() {
    this.isDisable = true;
    //Your code here
    this.isDisable = false;
  }

我是一个想要成为时尚的div
切换
类应用程序{
公共显示加载=错误；
切换（）{
this.showLoading=！this.showLoading；
} 
}

基本上，组件中需要有一个变量，用于通知模板api调用是已启动还是已完成

最初，“showLoading”将为false。在进行api调用时，将其设置为“true”。得到响应后，将其设置为“false”

在模板中，您将有一个类绑定“，如下所示-

export class YourComponent {

  isDisable = false;

  onClick() {
    this.isDisable = true;
    //Your code here
    this.isDisable = false;
  }

我是一个想要成为时尚的div
切换
类应用程序{
公共显示加载=错误；
切换（）{
this.showLoading=！this.showLoading；
} 
}

您可以将表行设为组件并禁用输入，如下所示 从“@angular/core”导入{Component，Input}

<div>
      <div [class.loading]=showLoading>
        I'm a div that wants to be styled
      </div>
      <button (click)="toggle()">Toggle</button>
</div>

class App {
  public showLoading = false;

  toggle() {
    this.showLoading = !this.showLoading;
  } 
}

@组件({
选择器：“表体”，
模板：`
{{i}}--{{item.rollno}
{{item.sname}
{{item.status！='NOT'？item.status:''}}
您可以将表行设为组件并禁用输入，如下所示
从“@angular/core”导入{Component，Input}

<div>
      <div [class.loading]=showLoading>
        I'm a div that wants to be styled
      </div>
      <button (click)="toggle()">Toggle</button>
</div>

class App {
  public showLoading = false;

  toggle() {
    this.showLoading = !this.showLoading;
  } 
}

@组件({
选择器：“表体”，
模板：`
{{i}}--{{item.rollno}
{{item.sname}
{{item.status！='NOT'？item.status:''}}
单击复选框后是否进行api调用？是的，我正在更新数据库中的数据，因此需要一些时间，因此我希望在第行显示等待消息，以便在完成第一个过程之前不允许再次单击同一行。单击复选框后是否进行api调用？是的，我正在更新数据库中的数据，因此需要一些时间，因此我希望显示等待消息msg在行上，因此不允许在完成第一个处理之前再次单击同一行更新的plunkr请立即检查。仍不适用于多行且您的plunkr未正确显示任何输出检查我能够看到plunkr输出。参考错误：系统未定义控制台显示此错误更新的plunkr请立即检查。仍不适用于mutiple row和您的plunkr未显示任何输出检查是否正确我可以看到plunkr输出。ReferenceError:系统未定义控制台显示此错误抱歉没有收到您的消息？我想通过不同的行加载，然后上面的不适用于我什么不同的加载？具体假设当我单击第一个rollno复选框时，仅此而已显示加载消息的行与其他行相同很容易清除哪一行更新请将您的代码放在一些在线编辑器中，我将帮助您。对不起，没有收到您的消息？我想通过不同的加载，然后上面的行对我不起作用什么不同的加载？请具体说明假设我单击第一个rollno复选框，然后仅针对显示l的行加载msg同样为其他很容易清除哪一行更新请把你的代码放在一些在线编辑器，我会帮你。