Question

我是Angular js的初学者。我不确定为什么这个错误出现在我的脚本文件中。我的代码如下所示：

angularExample.html

<!DOCTYPE html>
<html ng-app="Tutorial">
  <head>
    <link rel="stylesheet" type="text/css" href="scripts/bootstrap.min.css" />
    <script type="text/javascript" src="scripts/angular.min.js"></script>
    <script type="text/javascript" src="scripts/app.js"></script>
  </head>
  <body>
     <tutor-extension></tutor-extension>
  </body>
</html>

app.js

(function(){

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

app.directive('tutorExtension',function(){
    return
    {
        restrict: 'E',
        templateUrl: 'tutor-Extension.html',
        controller: function(){
                this.reviews=courseReviews;
                },
        controllerAs: 'extended'
    };
});

var courseReviews=[
{name:'abc',email:'abc@abc.com'},
{name:'xyz',email:'xyz@abc.com'},
{name:'pqr',email:'pqr@abc.com'}
];


})();

导师-Extension.html

<div ng-controller="extended as ext">
<ul ng-repeat='review in ext.reviews'>
     <li>{{review.name}}</li>
     <li>{{review.email}}</li>
</ul>
</div>

错误快照：

Error

enter image description here

Answer 1

对于路由，您应该在本地开发服务器上运行您的站点。 Read more here

Answer 2

有两个错误：

你在html模板中声明了controllerAs并重做相同的内容。

您应该将tutor-Extension.html作为

<div>
  <ul ng-repeat='review in ext.reviews'>
     <li>{{review.name}}</li>
     <li>{{review.email}}</li>
  </ul>
</div>

并且在指令中你应该写

controllerAs: 'ext'

可以通过删除return和object声明之间的新行来解决另一个问题（语法错误）。 JS引擎会将您的代码重新命名，就好像您什么都不返回，然后有一个块语句

app.directive（＃39＆; tutorExtension＆＃39;，函数（）{ 返回{

请在此处找到工作示例http://plnkr.co/edit/YocWRgKtCzlV0SRRpHK9

Answer 3

似乎只有空白问题。

您的代码如下：

(function(){

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

app.directive('tutorExtension',function(){
    return
    {
        restrict: 'E',
        templateUrl: 'tutor-Extension.html',
        controller: function(){
                this.reviews=courseReviews;
                },
        controllerAs: 'extended'
    };
});

var courseReviews=[
{name:'abc',email:'abc@abc.com'},
{name:'xyz',email:'xyz@abc.com'},
{name:'pqr',email:'pqr@abc.com'}
];   

})();

如下所示进行更改：请参阅我从仅返回和打开括号以及下一个语句中删除空格：）

(function(){

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

app.directive('tutorExtension',function(){
    return {
        restrict: 'E',
        templateUrl: 'tutor-Extension.html',
        controller: function(){
                this.reviews=courseReviews;
                },
        controllerAs: 'extended'
    };
});

var courseReviews=[
{name:'abc',email:'abc@abc.com'},
{name:'xyz',email:'xyz@abc.com'},
{name:'pqr',email:'pqr@abc.com'}
];

})();

永远记住空格会产生问题所以尽量避免它，你也可以深入研究here

Angular Js意外的令牌：

3 个答案: