firebase 로그인을 구현하는 동안 AngularDart에서 오류가 발생합니다.

Question

저는 AngularDart 프로젝트에서 firebase google 로그인을 구현하려고하지만 각도가 지정된 다트를 구현하는 동안 오류가 발생합니다. *ngIf 오타를 다시 확인했지만 필요한 것을 찾을 수 없습니다.

감사합니다. 감사합니다.

Error running TemplateGenerator for 
my_app|lib/views/layout_component/layout_component.dart. 
Error: Template parse errors: 
line 32, column 35 of LayoutComponent: ParseErrorLevel.FATAL: Can't bind to 
'ngIf' since it isn't a known native property or known directive. Please fix 
typo or add to directives list. 
*ngIf="fbService.user == null" 
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 
line 32, column 17 of LayoutComponent: ParseErrorLevel.FATAL: Property 
binding ngIf not used by any directive on an embedded template 
<div id="sign-in" *ngIf="fbService.user == null" class="horiz"> 
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 
line 37, column 36 of LayoutComponent: ParseErrorLevel.FATAL: Can't bind to 
'ngIf' since it isn't a known native property or known directive. Please fix 
typo or add to directives list. 
*ngIf="fbService.user != null" 
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 
line 37, column 17 of LayoutComponent: ParseErrorLevel.FATAL: Property 
binding ngIf not used by any directive on an embedded template 
<div id="sign-out" *ngIf="fbService.user != null" class="horiz"> 
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 

app_component.dart

import 'package:angular/angular.dart'; 
import 'package:angular_components/angular_components.dart'; 
import 'package:your_next_startup/views/layout_component/layout_component.dart'; 
import 'package:your_next_startup/services/firebase_service.dart'; 

@Component(
    selector: 'my-app', 
    styleUrls: const ['app_component.css'], 
    templateUrl: 'app_component.html', 
    directives: const [ 
    materialDirectives, 
    LayoutComponent, 
    ], 
    providers: const [ 
    materialProviders, 
    FirebaseService, 
    ], 
) 
class AppComponent { 
    final FirebaseService fbService; 

    AppComponent(FirebaseService this.fbService); 

} 

layout_component.dart 중포 기지 관련이있을 것 같지 않습니다

import 'package:angular/angular.dart'; 
import 'package:angular_components/angular_components.dart'; 
import 'package:m_app/services/firebase_service.dart'; 

@Component(
    selector: 'app-layout', 
    styleUrls: const [ 
     'layout_component.css', 
    ], 
    templateUrl: 'layout_component.html', 
    directives: const [ 
    materialDirectives, 
    ], 
    providers: const [ 
    FirebaseService, 
    ], 
) 
class LayoutComponent { 
    final FirebaseService fbService; 
    LayoutComponent(FirebaseService this.fbService); 
} 

layout_component.html

<div class="horiz"> 
      <div id="sign-in" *ngIf="fbService.user == null" class="horiz"> 
       <div id="google-icon" class="icon"></div> 
       <button class="btn btn-outline-secondary btn-sm" (click)="fbService.signIn()">Google Sign In</button> 
      </div> 

      <div id="sign-out" *ngIf="fbService.user != null" class="horiz"> 
       <img class="icon" [src]="fbService.user?.photoURL"> 
       <div id="user-name">{{fbService.user?.displayName}}</div> 
       <button class="btn btn-outline-secondary btn-sm" (click)="fbService.signOut()">Sign Out</button> 
      </div> 
     </div> 

Answer 1

. 3 각도 및 이전 지침에서

@Component(
    selector: 'app-layout', 
    styleUrls: const [ 
     'layout_component.css', 
    ], 
    templateUrl: 'layout_component.html', 
    directives: const [ 
    materialDirectives, 
    NgIf,    // one of these two 
    COMMON_DIRECTIVES, // this one includes NgIf, NgFor, NgSwitchCase, ... 
    ], 
    providers: const [ 
    FirebaseService, 
    ], 
) 
class LayoutComponent { 
    final FirebaseService fbService; 
    LayoutComponent(FirebaseService this.fbService); 
} 

이 더 이상 지원되지 않습니다, 전체 응용 프로그램에 대한 pubspec.yaml에 등록 할 수있는 모든 사용 지침은 그들이 사용되는 구성 요소 주석에 등록해야합니다.