Question

以下Angular js代码抛出错误 - ＆＃34; angular.js：13550 TypeError：无法读取属性＆＃39;编译＆＃39;未定义＆＃34;代码 -

HelloWorld.html

 <!DOCTYPE html>
    <html ng-app="module1">
    <head>
        <title>My First Custom Directive</title>
        <script src="../angular.js"></script>
        <script src="helloworldDirective.js"></script>
    </head>
    <body>
        <hello-world></hello-world>
    </body>
    </html>

helloWorldDirective.js -

(function() {

    var module1=angular.module('module1',[]);
    module1.directive('helloWorld',function(){
        return
        {
            template:'Hello Somesh!!Keep it up.'
        };

    });


}());

但是当我用以下代码替换java脚本文件时，它可以工作。

(function() {

    var module1=angular.module('module1',[]);
    var helloWorld=function()
{
var directive={};     
directive.template='Hello Somesh!!Keep it up.';
return directive;
}
module1.directive('helloWorld',helloWorld);

}());

这两个代码基本上都是一样的，但是一个代码失败了。有什么想法吗？

Answer 1

在第一个示例中，存在“无法访问的代码错误”。

您可以使用以下方法修复此错误：

return template = {template: 'Hello Somesh!!Keep it up.'};

否则你无法获得指向该属性的指针。

Answer 2

JavaScript的自动分号注入转为：

  return
        {
            template:'Hello Somesh!!Keep it up.'
        };

进入这个：

  return;
        {
            template:'Hello Somesh!!Keep it up.'
        };

返回，然后是无用的代码块。（template:被视为标签。）

调试提示：JSHint或JSLint会为您找到此错误。

样式提示：在JavaScript中，始终在同一行上保持打开括号...尽管此特定问题仅影响return和throw语句。

Answer 3

使用此方法定义指令：

 app.directive('helloWorld', [function () {
     return {
       restrict: 'E',
       transclude: false,
       template: 'Hello Somesh!!Keep it up.'
    }
}]);

angular.js：13550 TypeError：无法读取属性＆＃39; compile＆＃39;未定义？

3 个答案: