The "Providing HttpClient through dependency injection" documentation now shows that in case of a standalone boostraped app, the provideHttpClient is to include in the app.config.ts file.
Also updated the http setup server communication example to align the new doc (adev) with the old one (aio).
PR Close#52806
`application` builder is preferred over `browser` builder. This updates all the examples I could find to use `application` builder. A couple notes of fixes that needed to happen:
1. The testing example was broken because it relied on `~` imports in CSS files, which is a Webpack-specific features. However I don't think we need those custom styles at all, so I just removed the import altogether.
2. A few tests seemed to be affected and needed to be cleaned up.
PR Close#52361
Phase 2 sample code conversions per instructions in doc: https://docs.google.com/document/d/1QqnVK8Mc0O1gU9ctPrs-JJ42V9_dHCuEttD_01pXh34/edit
**Included**
1. ajs-quick-reference
Minor changes to remove references to NgModule. Converted sample to standalone.
2. architecture
Migrated the code sample. Made minor changes to remove references to NgModule. I explicitly deprecated the `architecture-module.md` page and removed it from the navigation.
4. deprecations / deprecations-guide
Migrated the code sample which required pulling NgModule and Reactive Forms material into a new `deprecated` folder. Made minor changes to clarify when advice was specific to NgModule (see `loadChildren` in particular).
5. displaying-data
Deleted this `displaying-data` sample entirely as there is no need for a sample app just to display a single, vanilla data binding in the deprecated `zone.md` page. Replaced reference in `zone.md` with an inline code snippet.
10. ngcontainer
Converted the code sample. There is no guide page for this sample. It can be displayed in Stackblitz
**Excluded**
3. cli-builder
Code sample is not an app; nothing to convert.
6-9 - related to getting-started and setup.
Waiting until Angular team is ready to proceed.
11. providers
This is in its own commit and PR 51918 because it may not make sense to convert. See that PR for details.
12. routing-with-urlmatcher
No work needed. Already Standalone.
13 schematics-for-libraries
Non-trivial (see doc notes) and Angular may decide to leave as is. Should have own PR.
14 setup
Non-trivial (see doc notes) and Angular may decide to leave as is. Should have own PR.
PR Close#51918
Enables the new `@` block syntax by default by removing the `enabledBlockTypes` flags. There are still some internal flags that allow special use cases to opt out of the block syntax, like during XML parsing and when compiling older libraries (see #51979).
PR Close#51994
Although there are several pages, only `service-worker-getting-started.md` has an example.
That example code was migrated.
Worked around the few references to NgModule.
Other changes as follows:
**Revised "Getting Started"**
The original service worker example page (`service-worker-getting-started.md`) is full of holes! I don’t know how anyone got this working just by following this page
- it doesn’t tell you where to get the example (and it isn’t generated by AIO)
- it doesn’t tell you that ng serve doesn’t support service worker apps
- it mentions http-server in passing but not what that is or where to get it.
- several commands tell you to supply the “project-name” but (a) it doesn’t tell you how to find that name and (b) you never actually have to provide a name at all. That includes on the command that gets http-server going.
**Hid section on `ngsw-config` tool**
Hid the discussion of the `ngsw-config` tool in `service-worker-config.md` because
(a) the command invoke it didn't seem to work and (b) it referenced `<project-name>`
without explaining what that is or where to find it.
Left the hidden text in the page in case someone wants to do something about this.
Meanwhile, you seem to be able to edit the `ngsw-config.json` and then rebuild.
That should suffice.
**Disabled E2E**
The AIO CI will no longer attempt to run the (thin) E2E tests.
These tests could lightly test the app with the dev server but couldn't test the Service Worker aspects; that would require launching the app with something other than `ng serve` and the AIO CI is not set up for that.
The existing tests appeared to pass when run locally with the dev server.
However, only one of them actually ran; test runner reported.
"There were tests whose specified size is too big."
Decided to bypass E2E testing of this project for now.
PR Close#51687
* Updates two of the md files to prioritize standalone components/architecture
* Updates three examples referenced in the guides
* Updates the svg diagram to reference the EnvironmentInjector instead of the ModuleInjector
PR Close#51572
E2E tests passed locally
**Added `readme.md` to the example code**
This explains how to build and run the example for both English and French.
**Archived `i18n-optional-manual-runtime-locale.md`**
I was asked to cut out a substantial swath of this page by reviewer "zip-fa". All that remained was a brief paragraph. I removed the page from the navigation after copying the remaining text to `i18n-optional-import-global-variants.md`. The page is still reachable by 3rd party links.
PR Close#51589
Heavily reworked with advice from Alan Agius.
FWIW
* `ng test` fails because there are no unit tests
* `yarn e2e` builds but fails - `Unable to start a WebDriver session.`
**Added `readme.md` to sample code**
Makes it easier for the casual downloader to try the example.
**Added `universal-ngmodule`**
The existing ngModule-based doc has a lot of guidance for developers who are still building with NgModule. Given that we are preserving the existing NgModule guidance (with modifications), it seems prudent to preserve the NgModule form of the Universal guidance. So I copied the existing guide and code to `universal-ngmodule` and added it to the left-side navigation under the "NgModules" sub-tree.
Warning: it retains all of the faults of the original guide ... faults that were addressed in the current revision.
PR Close#51564
The localize package intentionally duplicates some logic from the
compiler to avoid adding a dependency. This is now an error in the
packaging rule to prevent common pitfalls/code duplication. Here it's
an explicit decision though so we mark it as such and ask for the check
to be ignored for the particular import.
PR Close#51500
PR Close#51558
With #51148, the `ngComponentOutlet` directive now supports inputs.
This allows a less verbose and simpler API to instantiate components dynamicaly.
Fixes#49875
PR Close#49915
None of the guide pages mentions ngModules. Only `observables-in-angular` needed conversion to Standalone.
However, some of the guide pages reflect old versions of RxJS, including signatures that are no longer valid. These have been corrected.
More significantly, *the existing guide is pretty bad at explaining RxJS and its usage*. It was written (by me I think) in the very early days of Angular and Angular RxJS instruction. I've taught numerous "RxJS in Angular" classes since and learned from that experience what does and does not work with students.
There was neither the time nor the charter to completely overhaul this guide. But this commit attempts to remove what flops with students and to bring the teaching closer to what seems more effectively. I hope reviewers agree that my revisions are an improvement.
**Revised Overview**
The overview doc, `observables.md`, had a few errors (ex: `next` is NOT REQUIRED) and deprecated patterns (you now must pass the Observer object to `subscribe`).
More importantly, it was wildly overcomplicated and scary, especially when it got into multi-casting.
Moved the multi-casting section to "RxJS Library" and rewrote it (with working example) for simplicity and context.
I made other changes in an effort to make this an overview that is more comprehensive and more clear. I paid particular attention to the "Basic usage and terms" section.
Finally, I relocated the "Naming conventions for observables" section here from `rx-library`. This is the section that describes the dollar-sign convention. It made more sense for it to be here.
**Revised "RxJS Library" page and code**
*RxJS no longer supports chaining* and hasn't for a very long time. Removed note in `rx-library.md` that suggested you could use operator chaining.
The RxJS `pipe` discussion in the "Operators" section was just weird. Almost no one calls the `pipe` function. We certainly should *start* there. We should start with how people actually use operators - by adding them to the argument list of the `Observable.pipe()` method.
I kept the original `pipe` function example but subordinated it in a "callout". Most readers will (and should) ignore it.
`Subject` is a *critically important RxJS mechanism for creating custom observables*. It was completely missing from the list of observable creators on this guide page. So I added it to the "Observable creation functions" section of the guide and wrote an accompanying `MessageService` code sample (see the new `rx-library/app/` folder).
The `MessageService` is a pretty common pattern in Angular apps - far more common than creating an observable from a counter or an event, two of the creation patterns currently on this page.
This new section also afforded an opportunity to show how RxJS helps with building loosely coupled applications. We will soon be talking about Signals. Many will wonder whether and when they should still use RxJS.
At least a partial answer is that RxJS is really good at progressively combining and enhancing streams of data as they cross component boundaries. Of course you can pass signals around; but they are not as rich in transformers as RxJS. This is where RxJS shines.
**Revised "Comparing observables"**
The Promises section in `comparing-observables.md` had many errors and misleading remarks.
The comparison of error handling was especially egregious; the code example for that was nonsense.
The "Chain" sub-section was really about transforming values. It also failed to demonstrate chaining promise `.then`s.
Reworked these sub-sections and improved the code samples to match.
PR Close#51516
- Emphasized the importance of using the same InjectionToken instance for both provider and injection call.
- Added examples to illustrate correct usages to prevent NullInjectorError.
PR Close#51386