:私は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の関連する部分であります:私はobserverLocator使用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
}
- ここuserAccountsData.lengthの作動部分に関連するコードは次のとおりです。
constructor() {
this.userAccountsData = [];
....
this.subscribe = this.observerLocator.getObserver(accounts, "all")
.subscribe((value) => {
if (!value)
return;
this.userAccountsData = value;
**私が見つけた回避策(これは最善の方法ではありませんが)は、オブジェクトのapp.js(オブザーバー部分)で集計を行い、既に集約されたオブジェクトをバインドすることですカスタム要素に - これは動作しています。私はまだ上記の解決策を探しています。