Angular 指令模板抛出错误

Question

我在 Angular 指令模板中遇到了一些问题。

'use strict';

 function HomeDirective() {
  return {
    controller: 'homeController',
    template: require('./views/home.html'),

    restrict: 'AEC',
    scope: true
  }
}

module.exports = HomeDirective;

我在视图文件夹中有一个模板。我的视图是

<div>
<p>This is Home Page.You can nevigate to any page</p>
<p>The Content is {{test}}</p>
</div>

错误如下

<div>                                                                           
  ^                                                                               
ParseError: Unexpected token                                                        
at wrapWithPluginError (C:\Users\DAT-Asset-110\Desktop\Test 
Code\anguler_test_structure\node_modules\gulp-browserify\index.js:44:10) 

当我使用它时它正在工作

'use strict';

 function HomeDirective() {
    return {
    controller: 'homeController',

   template: '<div><p>This is Home Page.You can nevigate to any page</p>
   <p>The Content is {{test}}</p></div>',
    restrict: 'AEC',
    scope: true
  }
 }

 module.exports = HomeDirective;

谁能帮帮我。问题是什么，解决方法是什么？

Answer 1

使用 templateUrl 代替模板：templateUrl: 'views/home.html'

'use strict';

 function HomeDirective() {
  return {
    controller: 'homeController',
    templateUrl: 'views/home.html',

    restrict: 'AEC',
    scope: true
  }
}

module.exports = HomeDirective;