programing

유형 스크립트 오류 유형이 중복되지 않으므로 이 조건은 항상 'true'를 반환합니다.

copyandpastes 2023. 8. 14. 23:47
반응형

유형 스크립트 오류 유형이 중복되지 않으므로 이 조건은 항상 'true'를 반환합니다.

폼 그룹에 다음과 같은 조건이 있습니다.

if((age>17 && (this.frType=="Infant")) 
|| (age>40 && this.frType=="Grandchild")
|| (age<=5 && 
   (this.frType!="Child" 
   || this.frType!="Infant" 
   || this.frType!="Grandchild" || this.frType!="Cousin")))

여기에는 세 가지 주요 조건이 포함됩니다.

  1. 17세인 경우 다음으로 설정할 수 없습니다.infant
  2. 만약 사람이 40보다 크다면, 그는 될 수 없습니다.grandchild
  3. 만약 어떤 사람이 5년 미만이라면, 그는 그래야 합니다.child,infant,grandchild또는cousin.

이러한 조건 중 하나가 사실이면 오류 메시지를 보내겠습니다.

수신되는 오류는 다음과 같습니다.

[ts] 'Child'와 'Infrient' 유형이 겹치지 않으므로 이 조건은 항상 'true'를 반환합니다.[2367]

이 부분에.if조건':

|| this.frType!="Infant" || this.frType!="Grandchild" || this.frType!="Cousin")))

저는 다른 구성 요소에서 정확한 조건을 사용하고 있으며, 오류가 나타나지 않습니다.

if((age>17 && (this.family_relation_type=="Infant")) 
|| (age>40 && this.family_relation_type=="Grandchild")
|| (age<=5 && 
   (this.family_relation_type!="Child" || 
    this.family_relation_type!="Infant" || 
    this.family_relation_type!="Grandchild" || 
    this.family_relation_type!="Cousin")))

다음은 두 구성 요소의 수명을 계산하는 방법입니다.

let timeDiff = Math.abs(Date.now() - this.formGroup.controls['dob'].value);
let age = Math.floor((timeDiff / (1000 * 3600 * 24))/365);

독립 실행형 표현식을 고려합니다.

(this.frType!="Child" || this.frType!="Infant")

한다면frType이라Child두 번째 부분은 진실일 것이고, 그래서 표현은 다음과 같이 평가될 것입니다.true.한다면frType이라Infant그러면 첫 번째 부분은 진실일 것이고, 그래서 표현은 다음과 같이 평가될 것입니다.true.한다면frType 다 아닙니다 Child도 아니다Infant그러면 첫 번째 부분은 진실일 것이고, 표현은 다시, 평가될 것입니다.true논리에 결함이 있습니다. 항상 해결됩니다.true.

(추가로 추가하는 경우||을 위한 조건.Grandchild그리고.Cousin같은 일이 계속 일어나고 있습니다 - 그것은 항상 해결될 것입니다.true)

둘 중 하나 사용&&대신:

|| (age<=5 && (
   this.frType!="Child" 
   && this.frType!="Infant" 
   && this.frType!="Grandchild"
   && this.frType!="Cousin"
 ))

또는 논리를 더 쉽게 따르도록 배열을 사용하고 다음을 사용할 수 있습니다..includes:

const kidsFiveAndUnder = ['Child', 'Infant', 'Grandchild', 'Cousin'];
// ...
|| (age <= 5 && !kidsFiveAndUnder.includes(this.frType))

제가 누군가를 도울 수 있을지도 모릅니다.

이 경우 오류는 다음에 의해 트리거되었습니다.

*ngIf="fooArray.length === 0"

그래서 다음과 같이 수정했습니다.

*ngIf="fooArray.length < 1"

말이 안 되지만, 효과가 있습니다.

저는 최근에 이 문제로 어려움을 겪었습니다.여기서 나의 경험을 공유하는 것

기본적으로 IDE는 object.enum을 문자열과 비교할 수 없습니다.솔루션으로 component.ts의 메서드가 추가되어 열거형을 비교합니다.

세부사항:

export enum Status {
     NEW,
     PROGRESS,
     FINISHED
}

export interface Model {
   id : number;
   name : string;
   status : Status
}

이제 component.html에서 모델 상태를 비교하려고 했습니다.

<div *ngFor="let m of modelItems" >
      <i *ngIf="m.status === 'NEW'" class="icon-new"></i>
</div>

Error : This condition will always return 'false' since the types 'Status' and 'string' have no overlap.ngtsc(2367)

또한 component.ts에서 status enum을 정의하고 비교를 위해 사용했습니다.

public StatusEnum = Status; 

<div *ngFor="let m of modelItems" >
      <i *ngIf="StatusEnum[m.status] === 'NEW'" 
        class="icon-new"></i>
</div>

위의 솔루션을 사용하면 IDE 오류는 없지만 열거형[값]이 숫자 값을 제공하므로 조건이 참이 아닙니다.

다음으로 시도한 옵션은 다음과 같습니다.

<div *ngFor="let m of modelItems" >
      <i *ngIf="m.status=== StatusEnum[StatusEnum.NEW]" class="icon-new"></i>
    </div>

하지만 IDE에서 오류가 다시 발생했습니다.

Error : This condition will always return 'false' since the types 'Status' and 'string' have no overlap.ngtsc(2367)

마지막으로 문제를 해결한 것은 구성 요소에 메소드를 구현하는 것입니다.

해결책

구성 요소.ts

public StatusEnum = Status; //To refer in the HTML

 checkStatus(m: Model, status: Status): boolean {
    return Status[m.status] as unknown === status;
  } 

참고: 상태[m.status]가 알 수 없음으로 표시됩니다.

HTML

<div *ngFor="let m of modelItems" >
       <i *ngIf="checkStatus(m,StatusEnum.NEW)" 
       class="icon-new"></i>
  </div>    

모든 변수의 데이터 유형을 명시적으로 정의합니다.

예를 들어, 이 코드는 스레드 제목에 언급된 것과 동일한 오류를 가지고 있으며 변수의 데이터 유형을 명시적으로 정의하여 수정했습니다.

시작:

const selectedLangCulture = "en"; // or "ar-SA"
const direction = "rtl";
const languageChanged =
  (direction === "rtl" && selectedLangCulture === "en") ||
  (direction === "ltr" && selectedLangCulture === "ar-SA");

받는 사람:

const selectedLangCulture: string = "en"; // Put the datatype string.
const direction: string = "rtl"; // Put the datatype string.
const languageChanged =
  (direction === "rtl" && selectedLangCulture === "en") ||
  (direction === "ltr" && selectedLangCulture === "ar-SA");

제 경우, 저는 다음과 같은 유형을 사용했습니다.type는 " " " 입니다.React.ComponentPropsWithRef<'button'>

type ButtonProps = {
  type?: 'submit' | 'button' | 'link'; // ❌
} & React.ComponentPropsWithRef<'button'>;

그자리의 type다음과 같은 이유로 오버라이드되었습니다.React.ComponentPropsWithRef<'button'>가 있었습니다.type그 안에도.로 대체했습니다.elementType그러면 문제가 해결됩니다.

type ButtonProps = {
  elementType?: 'submit' | 'button' | 'link'; // ✅
} & React.ComponentPropsWithRef<'button'>;

"논리를 단순화"하기 위한 타자기 도움말처럼 보입니다.

  • 불필요한 로직 코드를 제거하는 데 도움이 됩니다.
  • 평균 하나의 참 -> 모두 참이므로 이후의 비교는 필요하지 않습니다.
  • 하나의 거짓을 의미합니다 -> 모두 거짓입니다, 그래서 비교는 필수입니다.

아래 코드로 이동하면 더 잘 이해할 수 있습니다.

code run on js typescript

저의 경우, 유형 정의가 잠시 동기화되지 않았기 때문에 앱을 다시 빌드해야 했습니다.

언급URL : https://stackoverflow.com/questions/53719693/typescript-error-this-condition-will-always-return-true-since-the-types-have-n

반응형