javascript - 我可以将类属性传递给 angularJS 中的指令模板吗？

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);
        }
    }
});

所以我可以从这样的 View 中调用它:

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

在 Controller 中我定义了警报对象:

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

我如何能够动态传递类型？试过了，但没有用。如果我将 alert-success 传递给指令，它会起作用，但我希望它是动态的。

这样做我可以动态地传递它吗？

谢谢

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);
        }
    }
});

因为你有隔离作用域使用=绑定(bind)父作用域属性

演示 Fiddle