Question

您好我已经创建了一个指令，它没有传回正确的消息。

该指令用于将工具提示传递回html页面

这就是html的样子

<info-text info-msg="Adding another applicant might help you to get approved."></info-text>

以下是指令

(function(){

angular.module('mainApp').directive('infoText', [function () {
    return {
        scope: { infoMessage: '&infoMsg' },
        restrict: 'E',
        replace: true,
        template: '<p class="info-text"><i class="fa fa-info-circle"></i> {{infoText}}</p>',
        link: function(scope, elem, attrs) {
            $(elem).prev().hover(function(){
                $(elem).addClass('info-hover');
            }, function(){
                $(elem).removeClass('info-hover');
            });
        }
    };
}]);

}());

我在页面上呈现的消息如下（它确实发送了glyphicon）：

{{infoText}}

任何想法，

感谢。基兰。

Answer 1

您不应该使用&进行此类绑定，基本上它用于表达式绑定。我认为单向绑定（@）对你正在做的事情是有效的。

此外，您应该将指令模板{{infoText}}更改为{{infoMessage}}

<强>标记

<info-text 
   info-msg="{{'Adding another applicant might help you to get approved.'}}"></info-text>

<强>指令

angular.module('mainApp').directive('infoText', [function () {
    return {
        scope: { infoMessage: '@infoMsg' },
        restrict: 'E',
        replace: true,
        template: '<p class="info-text"><i class="fa fa-info-circle"></i> {{infoMessage}}</p>',
        link: function(scope, elem, attrs) {
            $(elem).prev().hover(function(){
                $(elem).addClass('info-hover');
            }, function(){
                $(elem).removeClass('info-hover');
            });
        }
    };
}]);

为了使更清晰，更易读的html，您可以将该字符串放入某个范围变量，并将该范围变量传递到info-msg属性

角度|指令没有传递正确的值

1 个答案: