微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – Directive的模板没有获得由compile设置的值

请看这 Plunker

我有一个使用自定义角度指令的HTML

<body ng-controller="myCtrl">
    <h1>Hello Plunker!</h1>
    <div><sample attributeone="Sample Attribute"></sample></div>
  </body>

我的指令看起来像这样:

myApp.directive('sample',function() {
    var value = "";
        return {
            replace: true,restrict: 'E',scope : false,template: '<div>This is a sample Paragraph '+ value + '</div>',compile: function ( tElement,tAttributes ) {
              return {
                  pre: function preLink( scope,element,attributes ) {
                      console.log( attributes.log + ' (pre-link)'  );
                      value = tAttributes.attributeone;
                  }
              };
         }
        };
});

在我看来,编译前应该执行bofore返回模板,值应该设置为“Sample Attribute”.但它没有得到评估.

预期产出

This is a sample Paragraph Sample Attribute

实际产出

This is a sample Paragraph

有没有其他方法可以在模板中设置值?

解决方法

如果您只想附加值,那么为什么不将您的模板用作函数

请参阅此更新的Plunker

myApp.directive('sample',template: function(ele,attr,ctrl) {
              value = attr.attributeone;
              return '<div>This is a sample Paragraph ' + value + '</div>';
            }
        };
});

原文地址:https://www.jb51.cc/js/156995.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐