Question

我使用 Fuse主题（http://fuse-angular-material.withinpixels.com/dashboard-project）angularJS主题，我遇到了angular-translate和stepper的问题。我想翻译步骤的标题，但html语法很奇怪： step-title =＆＃34;＆＃39;描述＆＃39;＆＃34; 。如您所见，有双引号和简单引用（???），我不知道为什么......

这是一个例子：

<form name="stepper" ms-stepper ng-submit="vm.submitStepper()" ng-model="vm.stepper" novalidate>
    <ms-stepper-step ng-form="step1" step="1" step-title="'Description'">
        <div ng-include="'app/main/management/users/dialogs/stepper/step-description.html'"></div>
    </ms-stepper-step>

    <!--  other steps... -->
</form>

step-title =＆＃34;＆＃39;说明＆＃39;＆＃34; 是一个大问题，因为我无法在其上使用angular-translate。我不能做那样的事情：

        <ms-stepper-step ng-form="step1" step="1" step-title="'{{ 'trad' | translate }}'">

如何在stepper html属性中使用翻译？

非常感谢！

Answer 1

实际上你可以通过step-title="'{{ 'trad' | translate }}'"

因为它有stepTitle: '=?' 但我不确定

您可以更改组件的源代码：

  module.exports = function(){
    return {
        restrict: 'E',
        require : ['form', '^msStepper'],
        priority: 1000,
        scope   : {
            step        : '=?',
            stepTitle   : '=?',
            optionalStep: '=?',
            externalCallback: '&?',
            showButtons: '=?',
            status: '='
        },
        compile : function (tElement)
        {
            tElement.addClass('ms-stepper-step');

            return function postLink(scope, iElement, iAttrs, ctrls)
            {
                var FormCtrl = ctrls[0],
                    MsStepperCtrl = ctrls[1];

                // Is it an optional step?
                scope.optionalStep = angular.isDefined(iAttrs.optionalStep);

                // Register the step
                MsStepperCtrl.registerStep(iElement, scope, FormCtrl);

                // Hide the step by default
                iElement.hide();
            };
        }
    }
}

所以你需要修改步进指令

您有2个选项

尝试切换到stepTitle: '@'

OR

使用模板执行某些操作

 <div layout="column" layout-align="start start">
                <div class="title">{{step.stepTitle}}</div> <!-- here is the title-->
                <div class="subtitle" ng-if="MsStepper.isStepOptional(step.stepNumber)">Optional</div>
            </div>

转义HTML属性的转换

1 个答案: