मैं कोणीय 2 और कोणीय सामग्री के साथ प्रयोग कर रहा हूं। मैंने *ngFor
का उपयोग किया ताकि कोणीय <input>
तत्व मेरे लिए तत्व उत्पन्न कर सकें। हालांकि, परिणामी वेबपृष्ठ में, जेनरेट किए गए तत्व में name
विशेषता नहीं है।<input> तत्वों के साथ कोणीय 2 "नाम" विशेषता का बाध्यकारी * ngFor
यह order-form.component.html
में कोड है, जो इनपुट करने के लिए फल के विभिन्न प्रकार की संख्या उपयोगकर्ता पूछता है का हिस्सा है:
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 = PAYMENTS;
fruits: string[] = [
'apples',
'oranges',
'bananas'
];
constructor(public service: OrderService) {
}
ngOnInit() {
}
get totalCost() {
return this.service.getTotalCost(this.order);
}
onFocus(element: HTMLElement) {
element.blur();
}
onSubmit() {
console.log('onSubmit');
}
onInput(element: HTMLInputElement) {
console.log(element);
if (!this.service.isValidIntString(element.value)) {
window.alert(`Please input a correct number for ${element.name}`);
element.value = '0';
}
}
capitalize(str: string): string {
return this.service.capitalize(str);
}
get debug() {
return JSON.stringify(this.order, null, 2);
}
}
Chrome में:
<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>
यह इसी order-form.component.ts
है ब्राउज़र, जब मैं 'सेब' <input>
पर राइट क्लिक करता हूं, तो name
तत्व की विशेषता खाली है, लेकिन ng-reflect-name
apples
पर सही ढंग से सेट है? इस समस्या को कैसे हल करें? No name
attribute here, but ng-reflect-name
is apples
क्या आपको कोई त्रुटि मिल रही है? – Aravind
@ अरविंद नीचे कंसोल से, कोई त्रुटि नहीं है। –