: - 나는 app.html에서 잘 작동 개체 속성을 통해 문자열 interpulation이이 계정의 수를 보여줍니다 초기 로딩에바인딩 사용자 정의 요소가 아우렐 리아에서
ALL ACCOUNTS (${userAccountsData.length})
을 나는 것을 볼 수 이지만 - 템플릿 (사용자 정의 요소)의 동일한 데이터에 대해 집계 데이터 (활성 계정 수 계산)를 표시하려는 경우 0에서 실제 값 (데이터가 서비스에서 검색 중임)까지 몇 밀리 초 후에 값이 변경됩니다. 데이터는 0으로 유지되고 은으로 업데이트되지 않습니다. userAccountsData.length * 초기로드 후 다시 새로 고침 - 데이터가 있어야합니다. 이것은 app.html에서 사용자 정의 요소 인스턴스 :
<account-status-selection-bar accounts-data.bind="userAccountsData"></account-status-selection-bar>
는 그리고 이것은 사용자 정의 요소 자체의 HTML의 일부입니다
<template>
<div ref="active"
class="selection">${accountActivationDistribution.numberOfActiveAccounts}
이 사용자 정의 요소 VM의 관련 부분입니다 다음 app.js에서
"use strict";
import { bindable} from 'aurelia-framework';
export class accountStatusSelectionBar {
@bindable accountsData;
constructor() {
this.accounts = [];
this.accountActivationDistribution = { numberOfActiveAccounts: 0,
numberOfInactiveAccounts : 0,
numberOfTotalAccounts : 0
}
get activeAccounts() {
var activeAccounts = this.accounts.filter(function(account) {
return account.IsApproved;
});
return activeAccounts.length;
}
attached()//bind()
{
this.accounts = this.accountsData;
this.accountActivationDistribution.numberOfActiveAccounts =
this.activeAccounts
}
나는 observerLocator를 사용 - 여기 userAccountsData.length의 작업 부분에 관련된 코드는 다음과 같습니다
constructor() {
this.userAccountsData = [];
....
this.subscribe = this.observerLocator.getObserver(accounts, "all")
.subscribe((value) => {
if (!value)
return;
this.userAccountsData = value;
** 발견 된 해결 방법 (이 방법이 최선이라고는 확신 할 수는 없지만)은 객체의 app.js (옵저버 부분)에서 집계를 수행하고 이미 집계 된 객체를 바인딩하는 것입니다. 사용자 정의 요소에 -이 작동합니다. 나는 여전히 위에서 언급 한 해결책을 찾고있다.