Angular6 如何修复每行单击状态值更改时仅单击该行 我是这个角度的新手

我已经编写了使用*ngFor生成div的代码

我尝试单击每一行（span text），然后该行布尔值应该生效，但它也会更改其他行的值

我的目标是当单击跨行时，单击的行值应该改变

组件技术

从'@angular/core'导入{Component，NgModule，VERSION，Input，OnInit}；
从“@angular/platform browser”导入{BrowserModule}；
从'@angular/forms'导入{FormsModule}；
@组成部分({
选择器：“我的应用程序测试”，
模板：
你好
{{obj.text}
,
})
导出类TestComponent实现OnInit{
名称：字符串；
@Input（）clickStatus:boolean=false；
@Input（）对象列表：任意[]=[]；
objData={
姓名：'姓名'，
文本：“文本”
};
列表=[]；
构造函数（）{
this.name=

Angular！v${VERSION.full}

；
}
恩戈尼尼特（）{
for（设i=0；i<10；++i）{
this.objData={
名称：'名称'+i，
text:'text'+i
};
this.list.push（this.objData）；
}
console.log（'data..'，this.list）；
this.objList=this.list；
}
更改颜色（事件，obj）{
log（'event…'，event.target作为元素）；
console.log（'obj和clickstatus…'，obj，this.clickstatus）；
如果（此。单击状态）{
console.log（'如果为true，则单击状态'，此为.clickStatus）；
}否则{
console.log（'click status in else false'，this.clickStatus）；
}
this.clickStatus=！this.clickStatus；
}
}

我的代码编辑器：

---

好吧，您对所有行的密码使用相同的ngmodel，这将改变所有人。 如果你想这样做，就把它做成数组

  <div id="{{obj.name}}" *ngFor="let obj of objList;let i = index">
    <span id="{{obj.name}}" [(ngModel)]="clickStatus[i]" ngDefaultControl (click)='changeColor($event, obj,i)'>
      {{obj.text}}</span>
  </div>

 public clickStatus:Array<boolean>= new Array(this.objList.length);
  changeColor(event, obj,i) {
    console.log('event...', event.target as Element);
    console.log('obj and clickstatus ...', obj, this.clickStatus);
    if (this.clickStatus[i]) {
      console.log('click status in if true', this.clickStatus[i]);
    } else {
      console.log('click status in else false', this.clickStatus[i]);
    }
    this.clickStatus[i] = !this.clickStatus[i];
  }

{{obj.text}
public clickStatus:Array=新数组（this.objList.length）；
更改颜色（事件、obj、i）{
log（'event…'，event.target作为元素）；
console.log（'obj和clickstatus…'，obj，this.clickstatus）；
如果（此.clickStatus[i]）{
console.log（'click status in if true'，this.clickStatus[i]）；
}否则{
console.log（'click status in else false'，this.clickStatus[i]）；
}
this.clickStatus[i]=！this.clickStatus[i]；
}

这样的办法应该行得通