2

以下のようなカスタム要素があります。

<polymer-element>
    <template if="{{primaryLoaded}}">
        <template repeat="{{pData in primaryData}}">
            <p>{{pData.propertyOne}}</p>
            <p>{{someClass.someOperation()}}</p>
            <template if="{{secodaryLoaded}}">
                <p>{{secondaryData.someProperty}}</p>
                <p>{{someClass.someOperation()}}</p>
            </template>
        </template>
    </template>
</polymer-element>

および対応するダーツ ファイル:

class CustomElement extends PolymerElement with ObservableMixin
{
    @observable bool primaryLoaded = false;
    @observable bool secondaryLoaded = false;
    @observable var primaryData;
    @observable var secondaryData;
    @observable var someClass;

    void created()
    {
        primaryData = toObservable(new List<var>());
        secondaryData = toObservable(new List<var>());
    }

    void inserted()
    {
        someClass = new SomeClass();
        loadPrimaryData().then((pData) {
            primaryData = pData;
            primaryLoaded = true;
            loadSecondaryData().then((sData) {
                secondaryData = sData;
                secondaryLoaded = true;
            });
        });
    }
}

すべてが正常に動作しprimaryDataます。someOperation()そのプロパティが出力され、 onの呼び出しによってsomeClassそのデータが正しく出力されます。

問題はネストされたテンプレートにあります。の下には何も<template if="{{secondaryLoaded}}">表示されません。への呼び出しでさえ、someClass.someOperation()何も表示できません。

ここでスコープに問題はありますか？外側のテンプレートは dart ファイルで定義されたプロパティを問題なく参照できるように見えますが、ネストされたテンプレートは参照できません。

ここで、カスタム バインディング デリゲートを設定して、テンプレートで変数をグローバルとして設定する方法について読みました。ただし、false を返すため、カスタム要素に bindingDelegate を設定できませんisTemplate。

カスタム テンプレートでグローバル変数を設定する他の方法はありますか? それとも、私はこれについてすべて間違っていますか？

4

1 に答える 1

1

バグです。この問題にスターを付けると、変更の通知を受け取ることができます:

https://code.google.com/p/dart/issues/detail?id=12742

現時点でできることは、ネストされたテンプレートを他のポリマー要素に変換するか、テンプレートがネストされないようにする方法を見つけることだけです。

あなたの場合、使用する代わりにif="primaryLoaded"設定するだけで、が設定さprimaryData = nullれるまでテンプレートは何も表示されません。primaryDataprimaryData@observable

于 2013-10-21T17:37:43.877 に答える