Skip to content

feat(@schematics/angular): use signal in app component #29109

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@
<clipPath id="a"><path fill="#fff" d="M0 0h982v239H0z" /></clipPath>
</defs>
</svg>
<h1>Hello, {{ title }}</h1>
<h1>Hello, {{ title() }}</h1>
<p>Congratulations! Your app is running. 🎉</p>
</div>
<div class="divider" role="separator" aria-label="Divider"></div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { Component } from '@angular/core';
import { Component, signal } from '@angular/core';

@Component({
selector: '<%= selector %>',<% if(inlineTemplate) { %>
template: `
<h1>Welcome to {{title}}!</h1>
<h1>Welcome to {{ title() }}!</h1>

<% if (routing) {
%><router-outlet /><%
Expand All @@ -15,5 +15,5 @@ import { Component } from '@angular/core';
styleUrl: './app.<%= style %>'<% } %>
})
export class App {
protected title = '<%= name %>';
protected readonly title = signal('<%= name %>');
}
Original file line number Diff line number Diff line change
@@ -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: `
<h1>Welcome to {{title}}!</h1>
<h1>Welcome to {{ title() }}!</h1>

<% if (routing) {
%><router-outlet /><%
Expand All @@ -16,5 +16,5 @@ import { RouterOutlet } from '@angular/router';<% } %>
styleUrl: './app.<%= style %>'<% } %>
})
export class App {
protected title = '<%= name %>';
protected readonly title = signal('<%= name %>');
}
Original file line number Diff line number Diff line change
Expand Up @@ -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';

Expand All @@ -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)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand Down
4 changes: 2 additions & 2 deletions tests/legacy-cli/e2e/tests/misc/forwardref-es2015.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand Down