角度4中的输入值未显示,因为它以硬编码值显示

时间:2018-01-16 08:05:37

标签: angular

我在开发时面临未知问题。

Image

在上图中,可以看到具有值和硬编码值的输入字段。问题是硬编码值应该反映在输入字段中,但所有输入值都具有最后输入字段的值。

export class AppComponent  {
  name = 'Angular 4';
    temlateInputs=[
      {"name":"Australia","bi":"33","ex":"0","br":"50","ot":"0","ab":"AU"},
      {"name":"Austria","bi":"55","ex":"0","br":"25","ot":"0","ab":"AV"},
      {"name":"Belgium","bi":"66","ex":"0","br":"25","ot":"0","ab":"BB"},
      {"name":"China","bi":"77","ex":"88.887","br":"30","ot":"0","ab":"CH"}];
}

<table>
<tr *ngFor="let data of temlateInputs">
  <td>{{data.name}}</td>
  <td>{{data.bi}}
  <input  type="text" class="form-control" name="bi" [(ngModel)]="data.bi"      />
  </td>
  <td>{{data.ex}}
  <input  type="text" class="form-control" name="ex"  [(ngModel)]="data.ex"      />
  </td>
  <td>{{data.br}}
  <input  type="text" class="form-control" name="br"  [(ngModel)]="data.br"    />
  </td>
  <td>{{data.ot}}
  <input  type="text" class="form-control" name="ot"  [(ngModel)]="data.ot"     />
  </td>
</tr>
</table>

奇怪的是,它在stackblitz中完美运作

stackblitz演示

为什么我会遇到这样的错误。

1 个答案:

答案 0 :(得分:1)

只有具有相同的输入名称

才能实现

用此替换您的代码块并尝试:

Line.prototype.drawLinePath = function(path, lineColor, lineIndex) {
  var ii, rPath, row, straightPath, _i, _len, _ref,
  _this = this;
  straightPath = '';
  _ref = this.data;
  for (ii = _i = 0, _len = _ref.length; _i < _len; ii = ++_i) {
    row = _ref[ii];
    if (straightPath === '') {
      straightPath = 'M' + row._x + ',' + this.transY(this.ymin);
    } else {
      straightPath += ',' + row._x + ',' + this.transY(this.ymin);
    }
  }
  rPath = this.raphael.path(straightPath).attr('stroke', lineColor).attr('stroke-width', this.lineWidthForSeries(lineIndex));

  return (function(rPath, path) {
    return rPath.animate({
    path: path
    }, 500, '<>');
  })(rPath, path);
};