Question

我在编码angularjs应用程序时遇到了问题。

让我给出一个关于我正在做什么的摘要，我使用的是使用angularjs的模板，它使用的是ui路由器。我的问题是，似乎我可以调用控制器，但是当我加载页面时，它没有显示任何内容，这里是我正在工作的代码。

    <tr ng-repeat="tableHead in tableHeads">
          <th>{{ tableHead.th }}</th>
    </tr>

是的，它在这里有data-ng-class。

 <li data-ng-class="{open: $state.includes('app.apps')}">
  <a ui-sref="app.members">
    <i class="icon-user material-icons"></i>
    <span translate="menu.MEMBERS"></span>
  </a>
</li>

routes.js中的路线

//Members
  .state('app.members', {
    url: '/',
    templateUrl: 'views/members/members.html',
    resolve: {
      deps: ['$ocLazyLoad', function($ocLazyLoad) {
        return $ocLazyLoad.load('scripts/controllers/members.js');
      }]
    },
    title: 'Members'
  })

和控制器

'use strict';

function membersCtrl() {
var vm = this;
vm.dataMembers = {
    'ajax': 'data/datamembers-arrays.json'
};
vm.tableHeads = [
    { th: 'Date Created'},
    { th: 'Mobile'},
    { th: 'First Name'},
    { th: 'Last Name'},
    { th: 'User Type'},
    { th: 'Email'},
    { th: 'Unit#'},
    { th: 'Street'},
    { th: 'Postal Code'}
];
}
angular.module('app').controller('membersCtrl', membersCtrl);

{{ tableHeads.th }}只显示空白（带背景），但没有文字。

It got detected by chromedevtools

And shows no errors on console

感谢您抽空阅读！请帮忙：D

Answer 1

我不确定这是否能彻底解决您的问题。但是，我注意到你需要提出几个补救措施。希望这能解决你的问题。

1）在状态配置中指定控制器，如下所示：

.state('app.members', {
url: '/',
templateUrl: 'views/members/members.html',
resolve: {
  deps: ['$ocLazyLoad', function($ocLazyLoad) {
    return $ocLazyLoad.load('scripts/controllers/members.js');
  }]
},
title: 'Members',
controller: 'membersCtrl',
controllerAs: 'memCtrl'
})

2）接下来，请注意您将tableHeads设置为vm而不是$ scope。因此，您需要使用'controller as'语法。请注意，在上面的代码段中，我们提到了controllerAs: 'memCtrl'。因此，请按以下方式更改模板

<tr ng-repeat="tableHead in memCtrl.tableHeads">
      <th>{{ tableHead.th }}</th>
</tr>

Angular ng-controller似乎在路由中不起作用

1 个答案: