Fatal编程技术网
  • angularjs/
  • Angularjs 作为注释的角度指令不起作用

Angularjs 作为注释的角度指令不起作用

angularjs

Angularjs 作为注释的角度指令不起作用,angularjs,Angularjs,我引用的是AngularJS文档，但无法按照前面提到的方式使用“注释指令”，因为它实际上遇到了一个错误。详情如下： HTML:- <!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> <

我引用的是AngularJS文档，但无法按照前面提到的方式使用“注释指令”，因为它实际上遇到了一个错误。详情如下：

HTML:-

<!DOCTYPE html>
<html>
 <head>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
  <script type="text/javascript" src="JS/DirectiveAsComment.js"></script>
  <title>Directive as Comment</title>
 </head>
 <body ng-app="directiveAsCommentApp">
  <!-- directive:test-comment-directive -->
 </body>
</html>
错误：[$compile:tplrt]指令“testCommentDirective”的模板必须只有一个根元素

请帮助我解决此问题。

来自文档：

当指令在
模板
（或
模板URL
）和
替换
模式启用的情况下声明时，模板必须只有一个根元素。也就是说，模板属性的文本或
templateUrl
引用的内容必须包含在单个html元素中。例如，
诸如此类的废话
而不是简单的
诸如此类的废话
。否则，替换操作将导致单个元素（指令）被多个元素或节点替换，这是不受支持的，并且在实践中通常不需要

请参阅：

改变这个

template: 'this text is displayed because of "test-comment-directive" custom directive'
到

template:'显示此文本是因为“测试注释指令”自定义指令'
来自文档：

当指令在
模板
（或
模板URL
）和
替换
模式启用的情况下声明时，模板必须只有一个根元素。也就是说，模板属性的文本或
templateUrl
引用的内容必须包含在单个html元素中。例如，
诸如此类的废话
而不是简单的
诸如此类的废话
。否则，替换操作将导致单个元素（指令）被多个元素或节点替换，这是不受支持的，并且在实践中通常不需要

请参阅：

改变这个

template: 'this text is displayed because of "test-comment-directive" custom directive'
到

template:'显示此文本是因为“测试注释指令”自定义指令'
问题在于模板，请将它们写入一些标记，如或： 试试这个


作为注释的指令
在app.js中试试这个

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

app.directive('testCommentDirective', function(){
    return {
        restrict: "M",
        replace: true,
        template: "<div>this text is displayed because of 'test-comment-directive' custom directive</div>"
           };
    });

var-app=angular.module（'myApp'，[]）；
app.directive（'testCommentDirective'，function（）{
返回{
限制：“M”，
替换：正确，
模板：“由于“测试注释指令”自定义指令而显示此文本”
};
});
问题在于模板，请将它们写入一些标记，如或： 试试这个


作为注释的指令
在app.js中试试这个

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

app.directive('testCommentDirective', function(){
    return {
        restrict: "M",
        replace: true,
        template: "<div>this text is displayed because of 'test-comment-directive' custom directive</div>"
           };
    });

var-app=angular.module（'myApp'，[]）；
app.directive（'testCommentDirective'，function（）{
返回{
限制：“M”，
替换：正确，
模板：“由于“测试注释指令”自定义指令而显示此文本”
};
});
如果使用replace:true，您必须创建包含在简单html标记中的模板，如….模板标记如果使用replace:true，您必须创建包含在简单html标记中的模板，如….模板标记此问题是因为您的指令使用replace:true，在这种情况下，您的模板必须放入一个简单的html标记，如：template:'显示此文本是因为“测试注释指令”自定义指令'此问题是因为您的指令使用了replace:true，在这种情况下，您的模板必须放入一个简单的html标记，如：template:'显示此文本是因为“测试注释指令”自定义指令' 
var app = angular.module('myApp', []);

app.directive('testCommentDirective', function(){
    return {
        restrict: "M",
        replace: true,
        template: "<div>this text is displayed because of 'test-comment-directive' custom directive</div>"
           };
    });