小编Chi*_*CKY的帖子

<input>元素中带有*ngFor的"name"属性的Angular2绑定

我正在试验Angular2和Angular Material.我曾经*ngFor让Angular <input>为我生成元素.但是,在生成的网页中,生成的元素没有name属性.

这是代码的一部分order-form.component.html,它要求用户输入不同种类的水果的数量:

<md-list-item>
  <md-icon md-list-icon>shopping_cart</md-icon>
  <md-input-container *ngFor="let fruit of fruits" class="fruit-input">
    <input mdInput [(ngModel)]="order[fruit]" [placeholder]="capitalize(fruit)" 
           [id]="fruit" name="{{fruit}}" required value="0" #fruitInput 
           (input)="onInput(fruitInput)">
  </md-input-container>
</md-list-item>
Run Code Online (Sandbox Code Playgroud)

这是相应的order-form.component.ts:

import { Component, OnInit } from "@angular/core";
import { Order } from "app/order";
import { PAYMENTS } from "app/payments";
import { OrderService } from "app/order.service";

@Component({
  selector: 'app-order-form',
  templateUrl: './order-form.component.html',
  styleUrls: ['./order-form.component.css']
})
export class OrderFormComponent implements OnInit {

  order = new Order();

  payments = …
Run Code Online (Sandbox Code Playgroud)

input ngfor angular-material2 angular

16
推荐指数
1
解决办法
2万
查看次数

标签 统计

angular ×1

angular-material2 ×1

input ×1

ngfor ×1