重新编译后未定义 Angular 模板变量

如何解决重新编译后未定义 Angular 模板变量

我使用模板变量从父 svg 组件访问数据。 起初它工作得很好，但在使用默认的 ng serve 重新编译后不知何故，模板变量未定义。所以我必须重新启动 ng serve 并且它工作正常，直到我重建我的应用程序。 我不知道是什么变化导致了这个问题，因为它以前没有任何问题。

 <g app-parent-component #parentComponent>
    <g app-child-component [position]="{x:parentComponent.position,y:0}"> <!-- errors.ts:30 ERROR TypeError: Cannot read property 'position' of undefined -->
   </g>
</g>

父组件模板

@Component({
  selector: '[app-parent-component]',template: '    
     <svg:g class="parent-component">
       <ng-content></ng-content>
     </svg:g>',styleUrls: ['./app-parent-component.scss']
 })
 export class ParentComponent {
 ...
 }

angular.json

   ...
  "build":{
    "builder": "@angular-devkit/build-angular:browser","options": {
        "outputPath": "dist/my-app","index": "src/index.html","main": "src/main.ts","polyfills": "src/polyfills.ts","preserveSymlinks": true,"tsConfig": "tsconfig.app.json","aot": true,"assets": [
          "src/favicon.ico","src/assets"
        ],"styles": [
          "src/main.scss","src/styles.css"
        ],"scripts": []
      },},...
  "serve": {
      "builder": "@angular-devkit/build-angular:dev-server","options": {
        "browserTarget": "my-app:build","sourceMap": {
          "scripts": true,"styles": true,"vendor": true
        }
      },...