From 8a3cbc18bf99d40f96cdc4238e4a4f6d5581ed36 Mon Sep 17 00:00:00 2001
From: Wagner Maciel <wagnermaciel@google.com>
Date: Fri, 2 Dec 2022 13:22:29 -0500
Subject: [PATCH] fix(material/schematics): fix card tmpl migration

---
 .../components/card/card-template.spec.ts     | 26 +++++++++++++++++++
 .../mdc-migration/rules/tree-traversal.ts     |  6 ++---
 2 files changed, 29 insertions(+), 3 deletions(-)

diff --git a/src/material/schematics/ng-generate/mdc-migration/rules/components/card/card-template.spec.ts b/src/material/schematics/ng-generate/mdc-migration/rules/components/card/card-template.spec.ts
index 5e2311e2ce59..2fcdf0c1d155 100644
--- a/src/material/schematics/ng-generate/mdc-migration/rules/components/card/card-template.spec.ts
+++ b/src/material/schematics/ng-generate/mdc-migration/rules/components/card/card-template.spec.ts
@@ -114,6 +114,32 @@ describe('card template migrator', () => {
         ></mat-card>
       `,
     );
+    await runMigrationTest(
+      `
+      <mat-card
+        [style.width]="na === 1 ? '90%' : '18rem'"
+      >
+      `,
+      `
+      <mat-card
+        appearance="outlined"
+        [style.width]="na === 1 ? '90%' : '18rem'"
+      >
+      `,
+    );
+    await runMigrationTest(
+      `
+      <mat-card
+        (click)="onClick()"
+      >
+      `,
+      `
+      <mat-card
+        appearance="outlined"
+        (click)="onClick()"
+      >
+      `,
+    );
   });
 
   it('should migrate inline templates', async () => {
diff --git a/src/material/schematics/ng-generate/mdc-migration/rules/tree-traversal.ts b/src/material/schematics/ng-generate/mdc-migration/rules/tree-traversal.ts
index bfccf0e8a745..d8e7e81ce9bd 100644
--- a/src/material/schematics/ng-generate/mdc-migration/rules/tree-traversal.ts
+++ b/src/material/schematics/ng-generate/mdc-migration/rules/tree-traversal.ts
@@ -163,9 +163,9 @@ export function updateAttribute(
     return `${prefix} ${attrText}${suffix}`;
   }
 
-  const attr = node.attributes[0];
-  if (attr) {
-    const ctx = attr.sourceSpan.start.getContext(attr.sourceSpan.start.col + 1, 1)!;
+  const binding = node.attributes[0] ?? node.inputs[0] ?? node.outputs[0];
+  if (binding) {
+    const ctx = binding.sourceSpan.start.getContext(binding.sourceSpan.start.col + 1, 1)!;
     const indentation = ctx.before;
     return prefix + indentation + attrText + suffix;
   }