>

*ngFor 를 사용하여 컴포넌트의 여러 인스턴스를 추가했습니다. QueryList에서 모든 인스턴스를 사용할 수 있어야했기 때문입니다. 그런 다음 [hidden] 를 사용했습니다.  부울을 리턴 한 표현식을 기반으로 일부 구성 요소를 숨기려고합니다. 이것은 작동하지 않지만 [class.hide] 를 사용합니다.  했다. [class.hide] 는 무엇입니까  그것은 [hidden] 와 다릅니다 ? [hidden] 를 사용하는 앱의 다른 곳에서 코드를 수정해야 할까봐 걱정됩니다 .

  • 답변 # 1

    [hidden] 사용  각도에서 템플릿을 컴파일하고 HTML 요소의 속성을 hidden 로 설정합니다 . 속성이있는 요소는 브라우저에 표시되지 않습니다.

    또한 [hidden] 를 사용하는 샘플 코드 스 니펫을 만들었습니다.  속성과 잘 작동합니다. https://embed.plnkr.co/plunk/a3gdJp

  • 답변 # 2

    [hidden] 사용시  각도는 단순히 HTML 속성을 '숨김'으로 설정합니다.

    사용자 에이전트는이 속성을 가진 요소를 숨겨야하지만, 요소에 명시 적으로 지정된 다른 표시 스타일이 있으면 우선 순위가 높아진다는 점에주의해야합니다.

    와이즈 비즈

    아래 예에서 어떻게

    Note: Changing the value of the CSS display property on an element with the hidden attribute overrides the behavior. For instance, elements styled display: flex will be displayed despite the hidden attribute's presence.

    를보십시오   div 를 추가해도 숨겨지지 않습니다  속성.

    hidden
    
    
    div {
      display: block
    }
    
    

    와이즈 비즈

    <p hidden> Paragraph - Hide Me</p> <div hidden> Div - Hide Me</div> 와 함께 가고 싶다면  클래스 대신 속성을 사용하면

    We're worried we may need to modify code elsewhere in the app that uses [hidden]

    에 스타일을 간단히 추가 할 수 있습니다.  CSS 속성 :

    hidden
    
    
    hidden
    
    

    아이디어는 하나의 전략으로 가고 [hidden] { display: none !important; } div.show { display: block } 를 섞지 않는 것입니다.  그리고 <div class="show" hidden> Div - Hide Me</div>

    <시간>

    [hidden]  단순히 [class.hide] 클래스를 추가/제거합니다.  요소에, 그리고 당신은 [class.hide] 에 대한 스타일 규칙을 추가해야합니다  CSS에서. 위의 경고는 없습니다.

    hide
    
    
    hide
    
    

  • 답변 # 3

    .hide { display: none; } 와이즈 비즈  그것은 <p class="hide">Hide Me</p> 와 다릅니다 ?

    What does 에 바인딩  조건 적으로 [class.hide] 속성을 추가합니다  html 요소에.

    HTML 숨겨진 속성 와이즈 비즈 [hidden] 에 바인딩  조건부로 [hidden] 라는 클래스를 추가합니다.  html 요소에. 그런 다음 클래스 hidden 에 대한 스타일을 정의해야합니다.  (참조 된 .css 파일 또는 구성 요소 속성에 있음). 그것이 스타일이기 때문에 당신은

    When present, it specifies that an element is not yet, or is no longer, relevant.

    Browsers should not display elements that have the hidden attribute specified.

    를 만들 수 있습니다  너가 원하는 것을해라. 예를 들면 다음과 같습니다.

    [class.hide]
    
    

    사용해야하는 것은 맥락과 최종 목표에 달려 있습니다. hide 를 적용하는 데 문제가 없습니다  그래도 구성 요소에 직접. 이러한 문제가있는 경우 질문을 수정하고 검증 가능한 예제를 작성하기에 충분한 코드를 포함하는 것이 좋습니다.

    hide

관련 자료

  • 이전 python - pyautogui 및 openpyxl 용 배포 패키지
  • 다음 Nodejs MySQL 오류 처리