diff --git a/packages/schematics/angular/application/files/common-files/src/app/app.html.template b/packages/schematics/angular/application/files/common-files/src/app/app.html.template
index 235056e117fa..648d1b97051e 100644
--- a/packages/schematics/angular/application/files/common-files/src/app/app.html.template
+++ b/packages/schematics/angular/application/files/common-files/src/app/app.html.template
@@ -225,7 +225,7 @@
-
Hello, {{ title }}
+ Hello, {{ title() }}
Congratulations! Your app is running. 🎉
diff --git a/packages/schematics/angular/application/files/module-files/src/app/app.ts.template b/packages/schematics/angular/application/files/module-files/src/app/app.ts.template
index a7de7291cb3c..2bb65ba29ba7 100644
--- a/packages/schematics/angular/application/files/module-files/src/app/app.ts.template
+++ b/packages/schematics/angular/application/files/module-files/src/app/app.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.<%= style %>'<% } %>
})
export class App {
- protected title = '<%= name %>';
+ protected readonly title = signal('<%= name %>');
}
diff --git a/packages/schematics/angular/application/files/standalone-files/src/app/app.ts.template b/packages/schematics/angular/application/files/standalone-files/src/app/app.ts.template
index ec40bb8c0c07..71e7e0bffc24 100644
--- a/packages/schematics/angular/application/files/standalone-files/src/app/app.ts.template
+++ b/packages/schematics/angular/application/files/standalone-files/src/app/app.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.<%= style %>'<% } %>
})
export class App {
- protected title = '<%= name %>';
+ protected readonly title = signal('<%= name %>');
}
diff --git a/tests/legacy-cli/e2e/tests/build/prerender/error-with-sourcemaps.ts b/tests/legacy-cli/e2e/tests/build/prerender/error-with-sourcemaps.ts
index b7970cec4000..8e45499f0021 100644
--- a/tests/legacy-cli/e2e/tests/build/prerender/error-with-sourcemaps.ts
+++ b/tests/legacy-cli/e2e/tests/build/prerender/error-with-sourcemaps.ts
@@ -20,7 +20,7 @@ export default async function () {
await writeMultipleFiles({
'src/app/app.ts': `
- import { Component } from '@angular/core';
+ import { Component, signal } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterOutlet } from '@angular/router';
@@ -32,7 +32,7 @@ export default async function () {
styleUrls: ['./app.css']
})
export class App {
- title = 'test-ssr';
+ protected readonly title = signal('test-ssr');
constructor() {
console.log(window)
diff --git a/tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-server.ts b/tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-server.ts
index 77b9f9adab61..5205d20eeb0a 100644
--- a/tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-server.ts
+++ b/tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-server.ts
@@ -21,10 +21,10 @@ export default async function () {
await installWorkspacePackages();
// Test scenario to verify that the content length, including \r\n, is accurate
- await replaceInFile('src/app/app.ts', "title = '", "title = 'Title\\r\\n");
+ await replaceInFile('src/app/app.ts', "title = signal('", "title = signal('Title\\r\\n");
// Ensure text has been updated.
- assert.match(await readFile('src/app/app.ts'), /title = 'Title/);
+ assert.match(await readFile('src/app/app.ts'), /title = signal\('Title/);
// Add routes
await writeFile(
diff --git a/tests/legacy-cli/e2e/tests/misc/forwardref-es2015.ts b/tests/legacy-cli/e2e/tests/misc/forwardref-es2015.ts
index 32ca39e89713..48c28086cd0d 100644
--- a/tests/legacy-cli/e2e/tests/misc/forwardref-es2015.ts
+++ b/tests/legacy-cli/e2e/tests/misc/forwardref-es2015.ts
@@ -6,8 +6,8 @@ export default async function () {
// Update the application to use a forward reference
await replaceInFile(
'src/app/app.ts',
- "import { Component } from '@angular/core';",
- "import { Component, Inject, Injectable, forwardRef } from '@angular/core';",
+ "import { Component, signal } from '@angular/core';",
+ "import { Component, Inject, Injectable, forwardRef, signal } from '@angular/core';",
);
await appendToFile('src/app/app.ts', '\n@Injectable() export class Lock { }\n');
await replaceInFile(