Eğik 6 nesnelerin satır içi düzenlenebilir liste

oy
-1

Ben bir listesi var Person

class Person {
  name: string;
  birthdate: Date;
}

Ben başarıyla böyle bu listeyi görüntüler:

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Birthdate</th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor=let person of persons>
            <td>{{ person.name }}</td>
            <td>{{ person.birthdate }}</td>
        </tr>
    </tbody>
</table>

Şimdi saha yapmak istiyorum namedüzenlenebilir inline ve saha yapmak için birthdatedatepicker pop-up ile düzenlenebilir.
Ayrıca doğrulama gerekir ve modifikasyonlar bir web API çağrısı tetikleyecektir.
Bu hedefe ulaşmak için en iyi yolu nedir?

Oluştur 19/09/2018 saat 13:20
kaynak kullanıcı
Diğer dillerde...                            


2 cevaplar

oy
1

Böyle td metin girişi veya datepicker ekleyebilir

html dosyasında

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Birthdate</th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="let person of persons">
            <td><input type="text" (input)="onValueChange(person.name)" [(ngModel)]="person.name"/></td>
            <td><input type="date" [(ngModel)]="person.birthdate"/></td>
        </tr>
    </tbody>
</table>

ts

onValueChange(value:any){
  //this api call or whatever you need to do on value change
}

ya da benzeri diğer açısal tabanlı bileşenleri kullanabilir primeng veya ag-ızgara

Cevap 19/09/2018 saat 13:32
kaynak kullanıcı

oy
1

Bir kullanabilirsiniz bir formArray ile ReactiveForm ve kullanımı mydatepicker kütüphanesini datepicker için. Dökümanlar iyi tarif edilmiştir ancak herhangi bir sorunuz varsa ben asap cevap olacak! İşte iyi öğretici çok geçerli: https://alligator.io/angular/reactive-forms-formarray-dynamic-fields/

Cevap 19/09/2018 saat 13:30
kaynak kullanıcı

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more