반응형
새로운 Angular에서 ngSrc와 동등한 것은 무엇입니까?
JSON object에서 src가 나오는 img를 구현하고 싶습니다.
AngularJS에서 할 수 있는 일은 다음과 같습니다.
<img ng-src="{{hash}}" alt="Description" />
Angular 2+에 이것과 동등한 것이 있습니까?
AngularJS:
<img ng-src="{{movie.imageurl}}">
각도 2+:
<img [src]="movie.imageurl">
보간은 동일한 결과를 얻을 수 있습니다.
<img src="{{vehicle.imageUrl}}">
<img [src]="vehicle.imageUrl">
쌍방적 구속을 원하지 않는 한 재산상 구속력에 대해서는 이 두 진술 사이에 기술적인 차이가 없습니다.
보간은 많은 경우에서 속성 구속을 위한 편리한 대안입니다.실제로 Angular는 뷰를 렌더링하기 전에 보간을 해당 속성 바인딩으로 변환합니다.
Angular 애플리케이션에서 ng-src와 동일한 기능을 달성하기 위한 2단계 프로세스입니다.
첫번째 단계:
HTML에서 새 구문을 사용합니다.
<img [src]="imageSrc">
두 번째 단계:
구성요소/지시에서 값이 비어 있도록 초기화합니다.예를 들어,
@Component({
selector: 'ag-video',
templateUrl: './video.component.html'
})
export class SampleComponent {
imageSrc = '';
}
자, 이것은 그들이 그들과 함께null값이 요소에 설정되지 않아 네트워크 호출(빈 호출)이 발생합니다.
다음과 같은 보간 형식으로 작성할 수도 있습니다.
<img src="{{movie.imageurl}}">
<tr *ngFor="let post of posts | paginate: { id: 'server', itemsPerPage:
10, currentPage: p , totalItems: count }">
<td>
<img src="{{post.youtubeVideoId}}">
</td>
<td>
{{post.videoName}}
</td>
</tr>
언급URL : https://stackoverflow.com/questions/37965667/whats-equivalent-to-ngsrc-in-the-newer-angular
반응형
'programing' 카테고리의 다른 글
| 중복 키에 있는 MySQL...기존 신분증을 얻으십니까? (0) | 2023.10.01 |
|---|---|
| Powershell: Get-Child 아이템 출력을 한 번에 한 번씩 제대로 색칠하기 (0) | 2023.10.01 |
| 명령줄 응용 프로그램을 통해 Firefox에서 열려 있는 탭 목록을 얻으려면 어떻게 해야 합니까? (0) | 2023.09.26 |
| Driver Manager가 h2 데이터베이스에 연결할 때 mariadb 드라이버를 사용하려고 합니다. (0) | 2023.09.26 |
| MIN 및 MAX 매크로에 대응하는 스위프트 (0) | 2023.09.26 |