首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >angular指令中的作用域绑定不好

angular指令中的作用域绑定不好
EN

Stack Overflow用户
提问于 2016-10-10 21:35:35
回答 2查看 51关注 0票数 0

下午好

我是angular和指令方面的新手,有些东西的作用域不能正常运行(在我的例子中,当然是:)。

我定义了以下指令:

代码语言:javascript
复制
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>'
        }
});

})();

my html以这种方式使用该指令。

代码语言:javascript
复制
<svd-tool-bar id="toolbar" labelHeader="tasacion" name="toolbar" tooltipLabelSave="{{ 'VAL-NEW-I-N' | translate }}" enableSave="true"/>

在属性'labelHeader‘的情况下,有些事情我做得不对。所以,当加载html时,我看不到'tasacion‘属性。元素'labelHeader‘it为空。

我错过了什么?

提前感谢

EN

回答 2

Stack Overflow用户

发布于 2016-10-10 21:37:45

在属性中使用label-header

代码语言:javascript
复制
<svd-tool-bar id="toolbar" label-header="tasacion" 
票数 3
EN

Stack Overflow用户

发布于 2016-10-10 21:39:28

Angular要求属性名称用'-‘分隔(就像指令名称一样)。

所以不使用labelHeader,而使用label-header等。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39959586

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档