When push data to array decide which key need to use Sometimes I need to push data to the array, but I have one different key (here I have key color and key name) and another part of the object is the same. I use IF/else to check this, but i wonder is there any better and cleanest way to handle this?
  getData(passedData, dataControl: string) {
    const data = [];

    for (const value of passedData) {
      if (dataControl === 'color') {
        data.push({
          color: value,   ---&gt; diff
          username: this.userForm.value.username,
          test: this.userForm.value.test
        }
        );
        this.userForm.controls['data1'].setValue(data);     ---&gt; diff

      } else {
        data.push({
          name: value,     ---&gt; diff
          username: this.userForm.value.username,
          test: this.userForm.value.test
        }
        );
        this.userForm.controls['data2'].setValue(data);       ---&gt; diff

      }
    }
  }

Thank you
A few thoughts:

First, you might consider whether the name/color property REALLY needs to change as output here.  Why return { color: ... } in some cases and { name: ... } in others?  This tends to indicate that the return data may not sufficiently be describing itself. Even stranger here is the fact that the caller must pass in the hint dataControl &quot;hint&quot; in order to tell the function to modify the return value.  If the calling code is where understanding of &quot;color&quot; vs. &quot;name&quot; exists, then why make this function now have to understand this?  Why can the caller not just mutate a returned { name: ... } object into a { color: ... } one if it is really critical to make this distinction in property name.  Perhaps your object might be well suited to have properties like username, test, value (instead of name or color) and type (to indicate name vs. color).  At least this way to get a consistently formed data objects here (and your if-else goes away).
I am struggling to understand why you are looping through the passed data and setting data1 or data2 value repeatedly when, you are basically overwriting this set value X times (where X is the length of the array).  Why not just build the array once and then set the value?
You really only have two things that are changing when dataControl equals color.  You can just use variables and drop the if-else construct altogether.  In fact generally-speaking, much of you logic can be put into variables, as these values do not change for each iteration over passed data. Using variables here will also simplify your loop such that perhaps all you really need to do is call map on passedData.
Why hard-code your data1 and data2 targets?
It looks like this code has TypeScript type hinting, however no TypeScript tag was applied to this question.  You should either be consistent with your TypeScript usage (putting type hint for BOTH parameters), or not use it it all.

Putting it all together, might yield something like...
const getData = (passedData, dataControl) {
  let propName = 'name';
  let target = 'data2';

  if (dataControl === 'color') {
    propName = 'color';
    target = 'data1';
  }

  const username = this.userForm.value.username;
  const test = this.userForm.value.test;
  const targetEl = this.userForm.controls[target]; 

  const data = passedData.map((value) =&gt; {
    return {
      // if you still REALLY need color vs. name prop
      [propName]: value,
      username,
      test
    };
  });

  targetEl.setValue(data);
}