我正在尝试employee从empctrl模板中的控制器填充对象列表。
employee
empctrl
这是控制器:
app.controller('employeeController', function ($scope, employeeService) { this.employees = {}; this.populateTable = function (data) { this.employees = data; }; var error = function (err) { console.log("Error: " + err); }; // Call Service to List all Employees console.log("Service called to populate table."); employeeService.output().then(this.populateTable, error); this.populateTable(); });
但是,我编写的这段代码无法正常工作:
<div ng-repeat="employee in empctrl.employees.allEmployees" class="table_row"> <div class="table_column" style="width:2%">{{ $index + 1 }}</div> <div class="table_column" style="width:8%">{{ employee.employeeName}}</div> <!-- 7 more columns --> </div>
用户界面中未显示任何内容。 相反,如果我$scope.employees在控制器中编写代码,它将起作用:
$scope.employees
<div ng-repeat="employee in employees.allEmployees" class="table_row">
由于我知道$scope.<everything>在控制器中要做的事情很诱人,因此我在尝试避免$scope尽可能多地使用。
$scope.<everything>
$scope
如果有人能证明的正确使用$scope和差异betwee alias.abc和$scope.abc(其中alias是控制器的别名),我应该心存感激。
alias.abc
$scope.abc
alias
问题是this您正在访问内部populateTable函数而不是this控制器函数中存在的函数。
this
populateTable
最好将this变量保留在某个变量内,这样,通过获取变量,您可以确保引用的对象正确。
controller
app.controller('employeeController', function ($scope, employeeService) { var vm = this; vm.employees = {}; vm.populateTable = function (data) { vm.employees = data; }; var error = function (err) { console.log("Error: " + err); }; // Call Service to List all Employees console.log("Service called to populate table."); employeeService.output().then(vm.populateTable, error); vm.populateTable(); });
有关更多详细信息,我强烈建议您阅读 本文。