angularjs-directive - 如何评估包含 {{}} 的属性

Question

在以下指令中，我想 eval {{selectedForApproval.length}}。这在它不是指令时有效，但是一旦我将它放入指令中，我不确定如何处理绑定。

HTML：<button-large color="green" ng-click="completeWork()" label="Approve Selected ({{selectedForApproval.length}})"></button-large>

指示：

directive('buttonLarge', function () {
    return {
        scope: false,
        replace: true,
        restrict: 'E',
        template: '<button type="checkbox" class="buttonL"/>',
        link: function (scope, element, attrs) {
            var config = {
                label: "Submit",
                color: "Default"
            };

            angular.extend(config, attrs);

            element.addClass("b"+capitalize(config.color));
            element.html(scope.$parent.$eval(config.label));

            //capitalize first letter of string
            function capitalize(s) {
                return s[0].toUpperCase() + s.slice(1);
            }
        }
    }
})

Answer 1

解决方案是使用嵌入...

<button-large color="green" ng-click="completeWork()">Approve Selected ({{selectedForApproval.length}})</button-large>

directive('buttonLarge', function () {
        return {
            scope: false,
            replace: true,
            restrict: 'E',
            transclude: true,
            template: '<button type="checkbox" class="buttonL" ng-transclude/>',
            link: function (scope, element, attrs) {
                var config = {
                    color: "Default"
                };

                angular.extend(config, attrs);

                element.addClass("b"+capitalize(config.color));

                //capitalize first letter of string
                function capitalize(s) {
                    return s[0].toUpperCase() + s.slice(1);
                }
            }
        }
    })