0

2つのディレクティブがあります。1つは文字列を変換し、もう1つはタイトル付きのコンテナーを作成します。（および例を短くするために削除されたその他の機能）

グループボックス：

myapp.directive('groupbox', function () {
    return {
        restrict: 'E',
        priority: 200,
        template:
            '<fieldset>' +
            '<legend data-translate>{{title}}</legend>' +
            '<div data-ng-transclude></div>' +
            '</fieldset>',
        transclude: true,
        replace: true,
        scope: {title: '@'}
    };
});

翻訳:(簡略化）

myapp.directive('translate', ['$filter', function ($filter) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var e = $(element);
            var data = attrs.translate;

            var results = $filter('I')(e.html(), data);
            e.html(results.text);
            if (results.tooltip) e.attr('data-tooltip', results.tooltip);
        }
    };
}]);

私はそれを次のように使用します：

<groupbox title='settings'>
   content
</groupbox>

「グループボックス」のコンテンツはdivに入れられ、タイトルは「凡例」に入れられるという考え方です。この後、凡例はtranslateディレクティブで翻訳する必要があります。この変換は行われません（設定を出力するだけです）。'{{title}}'を'settings'に置き換えると、翻訳されます。

groupboxディレクティブの結果を操作するようにtranslateディレクティブを取得するにはどうすればよいですか。

4

1 に答える 1

0

タイトルを凡例に直接（バインドせずに）配置するコンパイル関数を追加することで修正しました。そうすれば、他の私のtranslateディレクティブの使用と何ら変わりはありません。

myapp.directive('groupbox', function () {
    return {
        restrict: 'E',
        transclude: true,
        replace: true,
        template:
            '<fieldset>' +
                '<legend>' +
                    '<span data-translate></span> - ' +
                    '<a data-ng-click="open = !open" data-translate>toggle</a>' +
                '</legend>' +
                '<div data-ng-show="open" data-ng-transclude></div>' +
            '</fieldset>',
        compile: function(element, attrs) {
            element.children('legend').children('span').html(attrs.title);
        }
    };
});
于 2013-01-25T10:55:48.647 に答える