Ionic3+AngularJS中如何在ion-input值变化时修改其name属性？

Yes, this is absolutely feasible, and it’s straightforward to implement using Angular’s property binding in Ionic 3. Here’s exactly how you can do it:

1. Dynamically bind the name attribute #

Instead of hardcoding the name value, use Angular’s bracket syntax to bind it to a property in your component. Update your template like this:

<ion-input [name]="inputName" type="number" placeholder="0" text-center (input)="handleInputChange()"></ion-input>

2. Add the component logic #

In your page’s TypeScript file, initialize the inputName property to "test", then create a method to update it when the user modifies the input:

export class YourComponentPage {
  inputName: string = 'test';

  handleInputChange() {
    // Switch the name attribute once the user interacts with the input
    this.inputName = 'test-changed';
  }
}

Quick Notes: #

• The (input) event fires every time the user types a character, so this will update the name immediately as they start modifying the value.
• If you only want to change the name once (not every time the input is edited), add a quick check to prevent repeated updates:

  handleInputChange() {
    if (this.inputName === 'test') {
      this.inputName = 'test-changed';
    }
  }
  

• Using Angular’s property binding ([name]) is the cleanest approach here—it’s framework-native and avoids messy direct DOM manipulation, which is generally discouraged in Angular apps.

This setup will exactly do what you need: change the name attribute from "test" to "test-changed" when the user modifies the input box.

内容的提问来源于stack exchange，提问作者Bruno Santos