Question

我在angularJS中得到了这个指令

productApp.directive('notification', function($timeout) {
    return {
        restrict : 'E',
        replace : true,
        scope : {
            type: "@",
            message: "@"
        },
        template : '<alert class="alert alert-type">message</alert>',
        link : function(scope, element, attrs) {
            $timeout(function() {
                element.hide();
            }, 3000);
        }
    }
});

所以我可以从这样的视图中调用它：

<notification type="alert.type" message="alert.msg"></notification>

在控制器中我定义了警告对象：

$scope.alert = { type : 'success', msg : 'This is a test'};

我如何动态传递类型？尝试过，它没有用。如果我将警报成功传递给指令，它可以工作，但我希望它是动态的。

我可以动态传递吗？

由于

Answer 1

尝试将指令更改为此指令：

productApp.directive('notification', function($timeout) {
    return {
        restrict : 'E',
        replace : true,
        scope : {
            type: "=",
            message: "="
        },
       template : '<alert class="alert alert-{{type}}">{{message}}</alert>',
        link : function(scope, element, attrs) {
            $timeout(function() {
               // element.hide();
            }, 3000);
        }
    }
});

由于您已隔离范围，因此使用=绑定父范围属性

演示 Fiddle

Answer 2

在你的链接功能中，你可以做这样的事情 attrs.type和attrs.msg检索您传递给指令的值。

我能将class属性传递给angularJS中的指令模板吗？

2 个答案: