在angular2中的* ngfor中为动态生成的元素添加属性

时间:2017-05-12 14:08:19

标签: javascript angular

我有以下html

    <table class="table table-bordered">
        <thead>
            <tr>
                <th class="col-md-5 tableSectionHeader">Description</th>
                <th class="col-md-1 tableSectionHeader">Quantity</th>
                <th class="col-md-1 tableSectionHeader">Cost</th>
                <th class="col-md-2 tableSectionHeader">Brand</th>
                <th class="col-md-2 tableSectionHeader">Other Brand</th>
                <th class="col-md-1 tableSectionHeader"></th>
            </tr>
        </thead>
        <tbody *ngIf="prototypeSampleRequest && prototypeSampleRequest.Items">
            <tr *ngFor="let item of prototypeSampleRequest.Items; let i=index;" 
                prototypeSampleRequest-item [item]="item" [itemIndex]="i" 
                [items]="prototypeSampleRequest.Items" 
                [brands]="brands"
                [isReadOnly]="isReadOnly"
                (itemsCostChangedEvent)="itemsCostChangedEvent()">

            </tr>
        </tbody>
    </table>

这是C#类

[Table("PrototypeSampleRequestItem")]
public class PrototypeSampleRequestItem
{
    public int Id { get; set; }
    public PrototypeSampleRequest PrototypeSampleRequest { get; set; }
    public int PrototypeSampleRequestId { get; set; }     
    public string Name { get; set; }        
    public decimal Quantity { get; set; }
    public decimal Cost { get; set; }
    public Brand Brand { get; set; }
    public int BrandId { get; set; }
}

所以我使用的服务获取prototypeSampleRequest.Items的数据并将其直接绑定到tr元素。

问题是生成的文本框是类型编号,我弹出一个表示它是“成本和数量”字段的无效值。这些字段在生成时的类型编号为

这是生成的html

<tr prototypesamplerequest-item="" ng-reflect-item="[object Object]" ng-reflect-item-index="0" ng-reflect-items="[object Object],[object Object],[object Object],[object Object]" ng-reflect-is-read-only="false" ng-reflect-brands="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]">

<td>
<input class="form-control input-sm ng-untouched ng-pristine ng-valid" type="text" ng-reflect-name="item.Name_" ng-reflect-is-disabled="false" ng-reflect-model="sa">
</td>

<td>
<input class="form-control input-sm numericField ng-untouched ng-pristine ng-valid" type="number" ng-reflect-name="item.Quantity_" ng-reflect-is-disabled="false" ng-reflect-model="5.66">
</td>

<td>
    <input class="form-control input-sm numericField ng-untouched ng-pristine ng-valid" type="number" ng-reflect-name="item.Cost_" ng-reflect-is-disabled="false" ng-reflect-model="6.5">
</td>

</tr>

我正在研究这个问题,可以通过在输入字段中添加step = any来修复此问题

<input type="number" step="any" />

所以我的问题是如何在* ngfor生成时将此属性添加到“成本和数量”字段中。

由于

0 个答案:

没有答案