首页 > 解决方案 > 根据 Http 响应启用/禁用按钮

问题描述

我目前正在开发一个以 .net 作为后端的 Angular 应用程序。我正在寻找有关如何在 Angular 中启用按钮、ajax 发布请求成功或响应在后端(c#)上准备好时的指导。

应用组件.html

 <button mat-button (click) = "cvalid()" >submit</button>
 <button mat-button id="getdoc" (click) = "getdoc()" [disabled] = "disabled" >Download</button>

应用组件.ts

cvalid(){
 $.ajax({
    type: "POST", 
    url: 'http://localhost:5000/api/D/Postdata',       
    data: d1,
   contentType: "application/json",    
  success: function (data) {
    console.log(data)
    console.log(typeof(data));
    this.disabled = false ; //button trigger .
  }, 
  error: function (data) {
      console.log('error in sending data...:(');

 },
  });
}

控制器

  [HttpPost]
   public IActionResult Postdata([FromBody] RootObject data)
   {
        var data1 = JsonConvert.SerializeObject(data)
        return Ok(data1);

   }

请指导我。提前致谢。

标签: .netajaxangular

解决方案


声明that = this,以便您对此有参考

试试这样:

cvalid(){
 this.disabled = true;
 var that = this;
 $.ajax({
    type: "POST", 
    url: 'http://localhost:5000/api/D/Postdata',       
    data: d1,
   contentType: "application/json",    
  success: function (data) {
    console.log(data)
    console.log(typeof(data));
    that.disabled = false ; //button trigger .
  }, 
  error: function (data) {
      console.log('error in sending data...:(');

 },
  });
}

注意:在 Angular 中,您应该使用HttpClient


推荐阅读