@angular/core 14.0.0-rc.1 → 14.0.0-rc.2

package/fesm2020/core.mjs

@@ -1,5 +1,5 @@
 /**
- * @license Angular v14.0.0-rc.1
+ * @license Angular v14.0.0-rc.2
  * (c) 2010-2022 Google LLC. https://angular.io/
  * License: MIT
  */
@@ -11368,6 +11368,21 @@ function createTNodeAtIndex(tView, index, type, name, attrs) {
     }
     return tNode;
 }
+/**
+ * Checks if the current component is declared inside of a standalone component template.
+ *
+ * @param lView An `LView` that represents a current component that is being rendered.
+ */
+function isHostComponentStandalone(lView) {
+    !ngDevMode && throwError('Must never be called in production mode');
+    const declarationLView = lView[DECLARATION_COMPONENT_VIEW];
+    const context = declarationLView[CONTEXT];
+    // Unable to obtain a context, fall back to the non-standalone scenario.
+    if (!context)
+        return false;
+    const componentDef = getComponentDef(context.constructor);
+    return !!(componentDef?.standalone);
+}
 /**
  * When elements are created dynamically after a view blueprint is created (e.g. through
  * i18nApply()), we need to adjust the blueprint for future
@@ -12036,7 +12051,7 @@ function elementPropertyInternal(tView, tNode, lView, propName, value, renderer,
             validateAgainstEventProperties(propName);
             if (!validateProperty(element, tNode.value, propName, tView.schemas)) {
                 // Return here since we only log warnings for unknown properties.
-                handleUnknownPropertyError(propName, tNode.value);
+                handleUnknownPropertyError(propName, tNode);
                 return;
             }
             ngDevMode.rendererSetProperty++;
@@ -12056,7 +12071,7 @@ function elementPropertyInternal(tView, tNode, lView, propName, value, renderer,
         // If the node is a container and the property didn't
         // match any of the inputs or schemas we should throw.
         if (ngDevMode && !matchingSchemas(tView.schemas, tNode.value)) {
-            handleUnknownPropertyError(propName, tNode.value);
+            handleUnknownPropertyError(propName, tNode);
         }
     }
 }
@@ -12162,7 +12177,17 @@ function matchingSchemas(schemas, tagName) {
  * @param propName Name of the invalid property.
  * @param tagName Name of the node on which we encountered the property.
  */
-function handleUnknownPropertyError(propName, tagName) {
+function handleUnknownPropertyError(propName, tNode) {
+    let tagName = tNode.value;
+    // Special-case a situation when a structural directive is applied to
+    // an `<ng-template>` element, for example: `<ng-template *ngIf="true">`.
+    // In this case the compiler generates the `ɵɵtemplate` instruction with
+    // the `null` as the tagName. The directive matching logic at runtime relies
+    // on this effect (see `isInlineTemplate`), thus using the 'ng-template' as
+    // a default value of the `tNode.value` is not feasible at this moment.
+    if (!tagName && tNode.type === 4 /* TNodeType.Container */) {
+        tagName = 'ng-template';
+    }
     const message = `Can't bind to '${propName}' since it isn't a known property of '${tagName}'.`;
     if (shouldThrowErrorOnUnknownProperty) {
         throw new RuntimeError(303 /* RuntimeErrorCode.UNKNOWN_BINDING */, message);
@@ -14948,7 +14973,10 @@ function elementStartFirstCreatePass(index, tView, lView, native, name, attrsInd
     const attrs = getConstant(tViewConsts, attrsIndex);
     const tNode = getOrCreateTNode(tView, index, 2 /* TNodeType.Element */, name, attrs);
     const hasDirectives = resolveDirectives(tView, lView, tNode, getConstant(tViewConsts, localRefsIndex));
-    ngDevMode && validateElementIsKnown(native, tNode.value, tView.schemas, hasDirectives);
+    if (ngDevMode) {
+        const hostIsStandalone = isHostComponentStandalone(lView);
+        validateElementIsKnown(native, tNode.value, tView.schemas, hasDirectives, hostIsStandalone);
+    }
     if (tNode.attrs !== null) {
         computeStaticStyling(tNode, tNode.attrs, false);
     }
@@ -15088,8 +15116,9 @@ function ɵɵelement(index, name, attrsIndex, localRefsIndex) {
  * @param tagName Name of the tag to check
  * @param schemas Array of schemas
  * @param hasDirectives Boolean indicating that the element matches any directive
+ * @param hostIsStandalone Boolean indicating whether the host is a standalone component
  */
-function validateElementIsKnown(element, tagName, schemas, hasDirectives) {
+function validateElementIsKnown(element, tagName, schemas, hasDirectives, hostIsStandalone) {
     // If `schemas` is set to `null`, that's an indication that this Component was compiled in AOT
     // mode where this check happens at compile time. In JIT mode, `schemas` is always present and
     // defined as an array (as an empty array in case `schemas` field is not defined) and we should
@@ -15109,14 +15138,17 @@ function validateElementIsKnown(element, tagName, schemas, hasDirectives) {
             (typeof customElements !== 'undefined' && tagName.indexOf('-') > -1 &&
                 !customElements.get(tagName));
         if (isUnknown && !matchingSchemas(schemas, tagName)) {
+            const schemas = `'${hostIsStandalone ? '@Component' : '@NgModule'}.schemas'`;
             let message = `'${tagName}' is not a known element:\n`;
-            message += `1. If '${tagName}' is an Angular component, then verify that it is part of this module.\n`;
+            message += `1. If '${tagName}' is an Angular component, then verify that it is ${hostIsStandalone ? 'included in the \'@Component.imports\' of this component' :
+                'a part of this module'}.\n`;
             if (tagName && tagName.indexOf('-') > -1) {
-                message += `2. If '${tagName}' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.`;
+                message +=
+                    `2. If '${tagName}' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the ${schemas} of this component to suppress this message.`;
             }
             else {
                 message +=
-                    `2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.`;
+                    `2. To allow any element add 'NO_ERRORS_SCHEMA' to the ${schemas} of this component.`;
             }
             if (shouldThrowErrorOnUnknownElement) {
                 throw new RuntimeError(304 /* RuntimeErrorCode.UNKNOWN_ELEMENT */, message);
@@ -21609,7 +21641,7 @@ class Version {
 /**
  * @publicApi
  */
-const VERSION = new Version('14.0.0-rc.1');
+const VERSION = new Version('14.0.0-rc.2');
 
 /**
  * @license
@@ -22337,7 +22369,7 @@ StandaloneService.ɵprov = ɵɵdefineInjectable({
     factory: () => new StandaloneService(ɵɵinject(EnvironmentInjector)),
 });
 /**
- * A feature that acts as a setup code for the {@see StandaloneService}.
+ * A feature that acts as a setup code for the {@link StandaloneService}.
  *
  * The most important responsaibility of this feature is to expose the "getStandaloneInjector"
  * function (an entry points to a standalone injector creation) on a component definition object. We
@@ -24409,6 +24441,12 @@ function isStandalone(type) {
     const def = getComponentDef(type) || getDirectiveDef(type) || getPipeDef$1(type);
     return def !== null ? def.standalone : false;
 }
+function generateStandaloneInDeclarationsError(type, location) {
+    const prefix = `Unexpected "${stringifyForError(type)}" found in the "declarations" array of the`;
+    const suffix = `"${stringifyForError(type)}" is marked as standalone and can't be declared ` +
+        'in any NgModule - did you intend to import it instead (by adding it to the "imports" array)?';
+    return `${prefix} ${location}, ${suffix}`;
+}
 function verifySemanticsOfNgModuleDef(moduleType, allowDuplicateDeclarationsInRoot, importingModule) {
     if (verifiedNgModule.get(moduleType))
         return;
@@ -24480,7 +24518,8 @@ function verifySemanticsOfNgModuleDef(moduleType, allowDuplicateDeclarationsInRo
         type = resolveForwardRef(type);
         const def = getComponentDef(type) || getDirectiveDef(type) || getPipeDef$1(type);
         if (def?.standalone) {
-            errors.push(`Unexpected "${stringifyForError(type)}" declaration in "${stringifyForError(moduleType)}" NgModule. "${stringifyForError(type)}" is marked as standalone and can't be declared in any NgModule - did you intend to import it?`);
+            const location = `"${stringifyForError(moduleType)}" NgModule`;
+            errors.push(generateStandaloneInDeclarationsError(type, location));
         }
     }
     function verifyExportsAreDeclaredOrReExported(type) {