如何通过角度为2

时间:2016-05-05 01:14:06

标签: javascript angularjs events angular

我不确定它是否合乎逻辑。 这是输入框的html代码。

<input type="text" id="name" #name="ngForm" [ngFormControl]="userProfileForm.controls['name']"  
             [(ngModel)]="loggedUserInfo.name" (change)="firechange($event,'name')"
             />

这是我的换火功能

 firechange($event, field){
      if(this.userProfileForm.controls[field].valid){
       this._userService.updateUserProfile(this.loggedUserInfo);
       this._userService.loadUserData(); 
      }
 }

我想只传递firechange函数中的事件,并且在fire change函数中我想从事件中获取输入字段名称,以便我能够理解我的表单中的哪个输入字段触发了事件。预期的代码将是那样的

[ngFormControl]="userProfileForm.controls['name']"  
                 [(ngModel)]="loggedUserInfo.name" (change)="firechange($event)"
                 />

firechange($event){
          if(this.userProfileForm.controls[$event.fieldname].valid){
           this._userService.updateUserProfile(this.loggedUserInfo);
           this._userService.loadUserData(); 
          }
 }

我理想的要求是,在一个表单中有多个表单字段,我甚至不想在每个单独的表单字段中编写firechange函数。有没有通用的方法在特定表单的每个输入字段值更改时调用事件而不将其写入每个输入字段?

6 个答案:

答案 0 :(得分:2)

要获取元素的实际名称,您可以执行以下操作:

firechange(event){
     var name = event.target.attributes.getNamedItem('ng-reflect-name').value;
     console.log('name')
}

答案 1 :(得分:1)

如果你想从火力变化功能中获取元素,你可能想尝试类似的东西:

firechange(event){
          let theElement = event.target;
          // now theElement holds the html element which you can query for name, value and so on
 }

如果您还想要指示组件在组件中使用单个指令在所有输入字段上应用firechange()逻辑(而不必在每个输入字段上指定),那么我建议您看看in Angular2 how to know when ANY form input field lost focus

我希望这会有所帮助

答案 2 :(得分:1)

如果id与您传递的名称相同,则可以获得名称

firechange(event){
  if(this.userProfileForm.controls[$event.target.id].valid){
}

答案 3 :(得分:0)

如果id不相同或者可以改变,那么这里有更多的杠杆......

您可能希望反映[name] 属性元素的属性

... #input [name]="item.name" [attr.name]="item.name" (change)="fn(input)" ...

然后,

...
fn(input) {
    log(input.name);  // now it returns the name
}
...

See more here

答案 4 :(得分:0)

尝试一下:

<input type="text" (change)="firechange($event.target.value)">

答案 5 :(得分:0)

这在Angular 10中对我有用

library(dplyr)

ds %>%
  group_by(record_id, voucher_number) %>%
  mutate(ice = row_number(), 
         ice = replace(ice, grep('app', voucher_number), 'app'))

#   record_id voucher_number ice  
#       <dbl> <chr>          <chr>
# 1         1 app1           app  
# 2         1 00000          1    
# 3         1 11111          1    
# 4         1 22222          1    
# 5         1 11111          2    
# 6         2 app2           app  
# 7         2 33333          1    
# 8         2 44444          1    
# 9         2 33333          2    
#10         2 33333          3    
#11         3 app            app  
#12         3 55555          1    
#13         3 66666          1    
#14         3 55555          2    
#15         3 66666          2    
#16         3 55555          3    
#17         3 77777          1