繁体   English   中英

角度指令的范围绑定不佳

[英]Scope in angular directive not binding well

下午好

我是angular和directive的新手,并且在范围上运行不正常(当然,就我而言:)。

我定义了以下指令:

angular.module('ToolBarMod', ['ngAria'])
.controller('ToolBarCtrl', [function ($scope) {}])
.directive('svdToolBar', function ($translate) {
    return {
        restrict: 'E',
        replace: true,
        scope: {
            id: '@id',
            name: '@name',
            labelHeader: '@labelHeader',
            tooltipLabelSave: '@tooltipLabelSave',
            enableSave: '@enableSave',
            onClickSave: '&onClickSave',
            onChange: '&onChange'
        },
        template: '<div id="{{name}}" class="md-toolbar-tools">' +
                      '<md-toolbar md-scroll-shrink>' +
                            '<div class="md-toolbar-tools titulo margin-8">'+
                                '{{labelHeader}}' +
                                '<md-button id="save" class="tool toolBarButton" ng-disabled="{{enableSave}}" aria-label="{{ \'GEN-SAVE\' | translate }}" ng-click="onClickSave">' +
                                    '<md-tooltip>'+'{{tooltipLabelSave}}'+'</md-tooltip>' +
                                    '<ng-md-icon icon="save"></ng-md-icon>'+
                                '</md-button>'+
                            '</div>' +
                      '</md-toolbar>' +
                      '<div flex></div>' +
                    '</div>'
        }
});

})();

和我的html这样使用指令

<svd-tool-bar id="toolbar" labelHeader="tasacion" name="toolbar" tooltipLabelSave="{{ 'VAL-NEW-I-N' | translate }}" enableSave="true"/>

在属性'labelHeader'的情况下,有些事情我做得不对。 因此,在加载html时,看不到属性“ tasacion”。 元素'labelHeader'为空。

我想念什么?

提前致谢

在属性中使用label-header

<svd-tool-bar id="toolbar" label-header="tasacion" 

Angular希望属性名称以'-'分隔(就像指令名称一样)。

因此,代替labelHeader使用label-header等。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM