Angularjs如何使用指令传入数据

时间:2013-07-25 15:12:43

标签: javascript html angularjs

我要做的是创建一个函数,以便我可以更改ng-grid列宽的高度。除了我的控制器中的作用域需要与我的指令中的作用域通信这一事实之外,这是无关紧要的。

.directive('getWidth', function(){
    return{
        controller: 'QuotesCtrl',
        link: function(scope){
            scope.smRowHeight = function(the value i want){
                scope.theRowHeight = the value i want;
            }
        }
    }
})

而我只是想能够进入我的HTML并说这个div我想要高度20

<div getWidth = '20'></div>

我环顾四周,找不到任何关于这个问题的事情。顺便说一句,在我的QuotesCtrl中我初始化了行高度,如此

$scope.theRowHeight;

有什么建议吗?

2 个答案:

答案 0 :(得分:0)

尝试这样的事情:

.directive('getWidth', function(){
    return{
        controller: 'QuotesCtrl',
        link: function(scope){
            console.log(scope.theRowHeight);
        },
        scope: {
           'theRowHeight': '='
        }
    }
});

标记:

<div the-row-height="20"></div>

答案 1 :(得分:0)

指令太棒了!您可以传入所谓的隔离范围,并且可以将值作为字符串或对控制器范围的引用传递。隔离范围有3个选项,您应该查看。 = @&amp;请参阅示例下方的文档链接。

Here is a working JSFiddle

.directive('getHeight', function(){
    return{
        scope: {
           "rowHeight": '='
        },
        controller: 'QuotesCtrl',
        link: function(scope){
            scope.smRowHeight = function(the value i want){
                scope.theRowHeight = the value i want;
            }
        }
    }
})

您需要更新html以传递新范围值。

<div get-height row-height='20'></div>

More Info on Directives