时间戳

首页 > 解决方案 > 在主应用程序模块中将组件作为依赖项传递后没有输出

angularjs - 在主应用程序模块中将组件作为依赖项传递后没有输出

问题描述

我正在学习 angularjs phonecat 教程，它工作正常，直到我创建 phonelist 组件的第 3 步。但是在第 4 步中，当我为 phonelist 组件（phone-list.module.js）声明一个单独的模块并修改 app.js 和 phone-list.component.js 时，我在浏览器中没有得到任何输出。那一刻我在定义 phoncatapp 模块时在依赖数组中传递电话列表不起作用。

// APP.MODULE.JS
  angular.module('phonecatApp', [
'phoneList'
  ]);


// PHONE-LIST.COMPONENT.JS
angular.
  module('phonecatList').
  component('phoneList', {  
 templateUrl:'phone-list.template.html',
 controller: function PhoneListController() {
  this.phones = [
    {
      name: 'Nexus S',
      snippet: 'Fast just got faster with Nexus S.'
    }, {
      name: 'Motorola XOOM™ with Wi-Fi',
      snippet: 'The Next, Next Generation tablet.'
    }, {
      name: 'MOTOROLA XOOM™',
      snippet: 'The Next, Next Generation tablet.'
     }
    ];
    }
   });

  //PHONE-LIST.MODULE.JS 
  angular.module('phoneList',[]);


  <!Doctype html>
  <html lang="en" ng-app="phonecatApp">
  <head>
 <meta charset="utf-8">
 <title>Google Phone Gallery</title>
 <link rel="stylesheet" href="app.css" />
 <script src="lib/angular/angular.js"></script>
 <script src="app.js"></script>
 <script src="phone-list.module.js"></script>
 <script src="phone-list.component.js"></script>

 </head>
 <body>

 <phone-list></phone-list>

  </body>
 </html>

标签： angularjs

解决方案

推荐阅读