각도 4

Question

여러 모듈의 구성 요소를 가져 나는 SharedModule

import { NgModule } from '@angular/core'; 
import { ControlMessagesComponent } from './control-messages.component'; 

@NgModule({ 
    imports: [ 
    ], 
    declarations: [ 
    ControlMessagesComponent 
    ], 
    exports: [ 
    ControlMessagesComponent, 
    ] 
}) 

export class SharedModule {} 

가 그럼 난이 개 다른 모듈에 수입이 : 여기

import { SharedModule } from './../shared/shared.module'; 

@NgModule({ 
    imports: [ 
     SharedModule 
    ], 
    declarations: [ 
    ], 
    providers: [ 
    ] 
}) 

export class OnboardModule {} 

import { SharedModule } from '../shared/shared.module'; 
@NgModule({ 
    imports: [ 
    SharedModule 
    ], 
    declarations: [ 

    ], 
    providers: [ 

    ] 
}) 

export class AModule {} 

는 ControlMessagesComponent

import { Component, Input } from '@angular/core'; 
import { FormGroup, FormControl } from '@angular/forms'; 
import { ValidationService } from './../validators/validator'; 

@Component({ 
    selector: 'control-messages', 
    template: `<div *ngIf="errorMessage !== null">{{errorMessage}}</div>` 
}) 
export class ControlMessagesComponent { 
    @Input() control: FormControl; 
    constructor() {} 

    get errorMessage() { 
    for (const propertyName in this.control.errors) { 
     if (this.control.errors.hasOwnProperty(propertyName) && this.control.touched) { 
     return ValidationService.getValidatorErrorMessage(propertyName, this.control.errors[propertyName]); 
     } 
    } 
    return null; 
    } 
} 

때입니다 나는 그것을 사용한다 : <control-messages [control]="form.controls.assetName"></control-messages>

나는 다음과 같은 오류 얻을 : 나는 누군가가 알려 주시기 바랍니다 수있는 옵션 중입니다

Can't bind to 'ngIf' since it isn't a known property of 'div'. ("]*ngIf="errorMessage !== null">{{errorMessage}}"): ng:///SharedModule/ControlMessagesComponent.html@0:5 Property binding ngIf not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations". ("[ERROR ->]{{errorMessage}}"): ng:///SharedModule/ControlMessagesComponent.html@0:0

을 내가 잘못 여기서 뭐하는 거지?

Answer 1

SharedModule에 CommonModule을 추가하십시오. NgIf 및 NgForOf은 CommonModule에있는 지시어이기도합니다. 구성 요소가 실제로 SharedModule 인 경우 NgIf을 사용하므로 모듈에서 가져와야합니다.

Description

The module that includes all the basic Angular directives like NgIf , NgForOf ,

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { ControlMessagesComponent } from './control-messages.component'; 

@NgModule({ 
    imports: [ 
    CommonModule 
    ], 
    declarations: [ 
    ControlMessagesComponent 
    ], 
    exports: [ 
    ControlMessagesComponent, 
    ] 
}) 

export class SharedModule {}