AngularJS - 输入指令的可能性

时间:2015-10-13 10:02:34

标签: javascript angularjs angularjs-directive

我对指令有疑问。我有指示:

<div class="social-button-fixed" id="share-btn3">
<g:plus action="share" href="returnPageUrl()" annotation="bubble" height="60" align="left" expandTo="left"></g:plus>
</div>
<script >
  window.___gcfg = {
    lang: 'en-US',
    parsetags: 'onload'
  };
</script>
<script src="https://apis.google.com/js/platform.js" async defer></script>

我尝试将此指令更多地放在页面上:

var app = angular.module('myapp', []);

app.directive('hello', function() {
  return {
      restrict: 'AE',
      replace: 'true',
      template: '<h3>Hello World!!</h3>'
  };
});

我期待4x Hello world !!在页面上,但只有1倍。当我删除第一个输入(<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en" ng-app="myapp"> <head> <meta charset="utf-8"> <title>My HTML File</title> <script src="../js/angular-1.4.7.js"></script> <script src="../js/directives/directives.js"></script> </head> <body> <hello/> <div data-hello ></div> <div data-hello ></div> <hello/> </body> </html> )所以确实有3x。为什么组合输入指令的规则?

1 个答案:

答案 0 :(得分:0)

没有什么似乎有任何错误,但根据您的描述,您可以尝试一件事。您可能会发现浏览器“错误地”解释了您的自定义HTML标记,并且没有意识到它们已被关闭。如果是这种情况,那么您将只看到一个,因为其他的包含在第一个div内,因此被替换。请尝试将标记更改为以下内容:

<hello></hello>
<div data-hello></div>
<div data-hello></div>
<hello></hello>

看看是否有效