मैट रेडियो बटन कैसे सेट करें जब हम प्राथमिक संपर्क विवरण बनाते हैं तो इसे दिखाया जाता है (छवि 1)
दिखाया गया है (छवि 2) जब हमें सेव बटन पर क्लिक करने पर विवरण मिलता है
फिर मैट टेबल पर दिखाया गया है (छवि 3) मैं छवि दिखाए जाने से पहले प्राथमिक सत्य प्राप्त करने पर केवल एक रेडियो बटन का चयन करना चाहता हूं
मैट टेबल पर मैट रेडियो बटन के लिए एक कोड है
<ng-container matColumnDef="primary" sticky>
<th mat-header-cell *matHeaderCellDef>Primary </th>
<td mat-cell *matCellDef="let element;">
<mat-radio-group>
<mat-radio-button></mat-radio-button>
</mat-radio-group>
</td>
</ng-container>
1 उत्तर
चयनित रेडियो बटन प्राप्त करने के लिए प्रत्येक रेडियो बटन पर क्लिक करें। रेडियो बटन के कॉलम में केवल एक चेक इन करने के लिए जांचें कि वर्तमान तत्व की आईडी चयनित आईडी के बराबर है या नहीं [checked]="primaryContact.id == element.id"
अपने रेडियो बटन टेम्प्लेट को नीचे दिए गए टेम्प्लेट में संशोधित करें
<ng-container matColumnDef="primary" >
<th mat-header-cell *matHeaderCellDef>Primary </th>
<td mat-cell *matCellDef="let element;">
<mat-radio-button (click)="primaryClick(element)"
[checked]="primaryContact.id == element.id" ></mat-radio-button>
</td>
</ng-container>
और ts में वर्तमान संपर्क को होल्ड करने के लिए इंस्टेंस वेरिएबल बनाएं जिसे प्राथमिक के रूप में चुना गया है। त्रुटियों से बचने के लिए इसके मान को डेटा की पहली पंक्ति पर सेट करें।
primaryContact={primary:false,name:'snfjn',mobile:328754,email:'@fndn',...your fields};
और अब प्राथमिक संपर्क को चयनित रेडियोधटन के तत्व पर सेट करने के लिए हैंडलर फ़ंक्शन
primaryClick(element){
this.primaryContact=element;
console.log(this.primaryContact.name)
}
स्टैकब्लिट्ज : https://stackblitz.com/edit/material-table-demo-wjpqsy< /ए>
संबंधित सवाल
नए सवाल
angular
Google से वेब फ्रेमवर्क के बारे में प्रश्न इस टैग का उपयोग कोणीय प्रश्नों के लिए करें जो एक व्यक्तिगत संस्करण के लिए विशिष्ट नहीं हैं। पुराने AngularJS (1.x) वेब ढांचे के लिए, कोणीयज टैग का उपयोग करें।