종이 토글 버튼을 부울에 바인딩하려고하는데 작동하지 않습니다. 나는 이미 바인딩 $=과 평가를 시도했다 ?=. 사용자가 isActive.
<template is="dom-repeat" items={{users}}>
<button class="heading" aria-expanded$="[[isExpanded(opened{{index}})]]" aria-controls="collapse{{index}}" onclick="toggle('#collapse{{index}}')" >{{item.firstName}} {{item.lastName}}<paper-toggle-button style="float: right;" checked$="{{item.isActive}}">Activo</paper-toggle-button></button>
<iron-collapse id="collapse{{index}}" tabindex="0" opened?="{{opened{{index}}}}">
<div class="content horizontal layout">
<div class="flex-1">
<paper-item>
<paper-item-body two-line>
<div>Email</div>
<div secondary>{{item.email}}</div>
</paper-item-body>
</paper-item>
<paper-item>
<paper-item-body two-line>
<div>Teléfono</div>
<div secondary>{{item.phone}}</div>
</paper-item-body>
</paper-item>
<paper-item>
<paper-item-body two-line>
<div>Género</div>
<div secondary>{{item.gender}}</div>
</paper-item-body>
</paper-item>
</div>
</div>
</div>
</iron-collapse>
</template>
JS :
ready: function() {
this.users = [
{firstName: 'Pedro', lastName: 'Vargas', email: '[email protected]', phone:'(222) 212 12 12', gender: 'Masculino', isActive:'true'},
{firstName: 'Andrea', lastName: 'Vargas', email: '[email protected]', phone:'(222) 212 12 13', gender: 'Femenino', isActive:'false'},
{firstName: 'Juan', lastName: 'Martínez', email: '[email protected]', phone:'(222) 212 12 12', gender: 'Masculino', isActive:'true'},
];}
function toggle(selector) {
document.querySelector(selector).toggle();
}
document.querySelector('template[is=dom-repeat]').isExpanded = function(opened) {
return String(opened);
};
문제는 어레이에 있습니다. 모든 isActive개체는 따옴표로 묶여서 문자열이됩니다.
부울로 만들고 싶으므로 따옴표를 제거하십시오.
{
firstName: 'Pedro',
lastName: 'Vargas',
email: '[email protected]',
phone: '(222) 212 12 12',
gender: 'Masculino',
isActive: true
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다