diff --git a/packages/schematics/angular/application/files/module-files/src/app/app.component.spec.ts.template b/packages/schematics/angular/application/files/module-files/src/app/app.component.spec.ts.template
index 1575222d09d9..f5713d0ec0e1 100644
--- a/packages/schematics/angular/application/files/module-files/src/app/app.component.spec.ts.template
+++ b/packages/schematics/angular/application/files/module-files/src/app/app.component.spec.ts.template
@@ -25,7 +25,7 @@ describe('AppComponent', () => {
it(`should have as title '<%= name %>'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
- expect(app.title).toEqual('<%= name %>');
+ expect(app.title()).toEqual('<%= name %>');
});
it('should render title', () => {
diff --git a/packages/schematics/angular/application/files/module-files/src/app/app.component.ts.template b/packages/schematics/angular/application/files/module-files/src/app/app.component.ts.template
index 793876b3af5c..7227fbc8b664 100644
--- a/packages/schematics/angular/application/files/module-files/src/app/app.component.ts.template
+++ b/packages/schematics/angular/application/files/module-files/src/app/app.component.ts.template
@@ -1,9 +1,9 @@
-import { Component } from '@angular/core';
+import { Component, signal } from '@angular/core';
@Component({
selector: '<%= selector %>',<% if(inlineTemplate) { %>
template: `
-
Welcome to {{title}}!
+ Welcome to {{ title() }}!
<% if (routing) {
%><%
@@ -15,5 +15,5 @@ import { Component } from '@angular/core';
styleUrl: './app.component.<%= style %>'<% } %>
})
export class AppComponent {
- title = '<%= name %>';
+ title = signal('<%= name %>');
}
diff --git a/packages/schematics/angular/application/files/standalone-files/src/app/app.component.spec.ts.template b/packages/schematics/angular/application/files/standalone-files/src/app/app.component.spec.ts.template
index 300f7b6466ae..710b9c39def9 100644
--- a/packages/schematics/angular/application/files/standalone-files/src/app/app.component.spec.ts.template
+++ b/packages/schematics/angular/application/files/standalone-files/src/app/app.component.spec.ts.template
@@ -19,7 +19,7 @@ describe('AppComponent', () => {
it(`should have the '<%= name %>' title`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
- expect(app.title).toEqual('<%= name %>');
+ expect(app.title()).toEqual('<%= name %>');
});
it('should render title', () => {
diff --git a/packages/schematics/angular/application/files/standalone-files/src/app/app.component.ts.template b/packages/schematics/angular/application/files/standalone-files/src/app/app.component.ts.template
index a32b7b08296f..98891b9868ed 100644
--- a/packages/schematics/angular/application/files/standalone-files/src/app/app.component.ts.template
+++ b/packages/schematics/angular/application/files/standalone-files/src/app/app.component.ts.template
@@ -1,11 +1,11 @@
-import { Component } from '@angular/core';<% if(routing) { %>
+import { Component, signal } from '@angular/core';<% if(routing) { %>
import { RouterOutlet } from '@angular/router';<% } %>
@Component({
selector: '<%= selector %>',
imports: [<% if(routing) { %>RouterOutlet<% } %>],<% if(inlineTemplate) { %>
template: `
- Welcome to {{title}}!
+ Welcome to {{ title() }}!
<% if (routing) {
%><%
@@ -16,5 +16,5 @@ import { RouterOutlet } from '@angular/router';<% } %>
styleUrl: './app.component.<%= style %>'<% } %>
})
export class AppComponent {
- title = '<%= name %>';
+ title = signal('<%= name %>');
}