<video
#videos
class="object-cover video"
autoplay
[muted]="true"
loop
>
<source type="video/mp4" src="/assets/videos/search.mp4" />
</video>
- `#videos`: 이 부분은 주석으로 보이며 실제로는 영향을 주지 않습니다. 주석은 코드의 의도를 설명하거나 기타 참고 사항을 제공하는 데 사용됩니다.
- `class="object-cover video"`: 이 부분은 `class` 속성을 사용하여 요소에 CSS 클래스를 할당하는 것을 나타냅니다. `object-cover`와 `video` 클래스는 CSS 스타일링을 위해 사용될 수 있습니다.
- `autoplay`: 이 속성은 비디오가 자동으로 재생되도록 지정합니다. 페이지가 로드되면 비디오가 자동으로 시작됩니다.
- `[muted]="true"`: 이 부분은 Angular의 바인딩 구문으로, 비디오를 음소거하는 속성입니다. `true` 값으로 설정되어 있으므로 비디오는 음소거됩니다.
- `loop`: 이 속성은 비디오가 반복 재생되도록 지정합니다. 비디오가 끝에 도달하면 자동으로 처음부터 재생이 반복됩니다.
- `<source type="video/mp4" src="/assets/videos/search.mp4" />`: 이 부분은 `<video>` 요소 안에 `<source>` 요소를 사용하여 비디오 파일을 지정하는 부분입니다. `type` 속성은 비디오 파일의 MIME 유형을 나타내고, `src` 속성은 비디오 파일의 경로를 지정합니다. 이 예제에서는 "video.mp4" 파일을 `/assets/videos/` 경로에서 찾습니다.
이렇게 작성된 코드는 "search.mp4"라는 비디오 파일을 표시하며, 자동 재생되고 음소거 상태로 반복 재생됩니다.
