Question

这是我的控制器代码，一旦函数init（）运行，它就会为this.customers返回undefined。

myApp.controller('OrdersController',['$routeParams', function ($routeParams) {
var customerId = $routeParams.customerId;
this.orders = null;


this.customers = [
    {joined: '2012-12-03', name: 'Amit', city: 'Delhi', orderTotal: 34.53,orders: [{id:1,product:'shoes',total:'34.53'}]},
    {joined: '1995-04-24', name: 'Ravi', city: 'Mumbai',orderTotal: 45.34,orders: [{id:2,product:'socks',total:'53.51'}]},
    {joined: '2003-03-21', name: 'Flish', city: 'Lonavla', orderTotal: 134.323,orders: [{id:3,product:'books',total:'43.55'}]},
    {joined: '2003-10-14', name: 'Meahe', city: 'Pune', orderTotal: 12.33,orders: [{id:4,product:'eraser',total:'12.33'}]}
];

function init() {
    console.log('infunc',this.customers);
    //search the customers for customerId
    for(var i=0; i < this.customers.length; i++){
        if(this.customers[i].orders[0].id === parseInt(customerId)) {
            this.orders = this.customers[i].orders;
        }
    }
}

init();

}]);

Answer 1

您的问题基本上由this SO question回答，这解释了this和$scope不一定是同一回事。创建控制器时，this是控制器，$scope也是如此。但是，当实际评估函数init()时，无法保证this与$scope具有相同的含义。在任何情况下，使用this存储的数据都无法用于任何视图，而只有存储到$scope的内容才可用。因此有很多原因，您应该将代码更改为：

myApp.controller('OrdersController',['$routeParams', function ($routeParams) {
    var customerId = $routeParams.customerId;
    $scope.orders = null;

    $scope.customers = [
        {joined: '2012-12-03', name: 'Amit', city: 'Delhi', orderTotal: 34.53,orders: [{id:1,product:'shoes',total:'34.53'}]},
        {joined: '1995-04-24', name: 'Ravi', city: 'Mumbai',orderTotal: 45.34,orders: [{id:2,product:'socks',total:'53.51'}]},
        {joined: '2003-03-21', name: 'Flish', city: 'Lonavla', orderTotal: 134.323,orders: [{id:3,product:'books',total:'43.55'}]},
        {joined: '2003-10-14', name: 'Meahe', city: 'Pune', orderTotal: 12.33,orders: [{id:4,product:'eraser',total:'12.33'}]}
    ];

    function init() {
        console.log('infunc',this.customers);
        for (var i=0; i < this.customers.length; i++) {
            if ($scope.customers[i].orders[0].id === parseInt(customerId)) {
                $scope.orders = $scope.customers[i].orders;
            }
        }
    }

    init();
}]);

Answer 2

最好定义var vm = this然后使用而不是this。

myApp.controller('OrdersController',['$routeParams', function ($routeParams)        {
var vm = this; 
var customerId = $routeParams.customerId;
vm.orders = null;

vm.customers = [
    {joined: '2012-12-03', name: 'Amit', city: 'Delhi', orderTotal: 34.53,orders: [{id:1,product:'shoes',total:'34.53'}]},
    {joined: '1995-04-24', name: 'Ravi', city: 'Mumbai',orderTotal: 45.34,orders: [{id:2,product:'socks',total:'53.51'}]},
    {joined: '2003-03-21', name: 'Flish', city: 'Lonavla', orderTotal: 134.323,orders: [{id:3,product:'books',total:'43.55'}]},
    {joined: '2003-10-14', name: 'Meahe', city: 'Pune', orderTotal: 12.33,orders: [{id:4,product:'eraser',total:'12.33'}]}
];

function init() {
    console.log('infunc',vm.customers);
    for (var i=0; i < vm.customers.length; i++) {
        if ($scope.customers[i].orders[0].id === parseInt(customerId)) {
            vm.orders = vm.customers[i].orders;
        }
    }
 }

  init();
}]);

Answer 3

@Tim Biegeleisen和hadiJz的回复非常有帮助并且包含您需要知道的所有内容，但我正在回复一般的Javascript解释并想要包含它。这个简化的摘录帮助我在使用Angular的元素时对this进行了解释：

关于Javscript，this可以绑定三种不同的方式方法。 this绑定在被调用函数的本地范围内（它不是对象的属性）。如果正常调用函数（例如，f（）），然后'this'指向全局对象。如果一个功能作为构造函数调用（即作为'new'的一部分），然后'this' 指向新创建的对象。 this的最后一种情况是方法调用（例如，a.f（）），其中'this'将指向通过评估点左侧产生的对象。

我不是在试图窃取答案而你应该选择Tim或者hadiJz，但这可能会帮助你理解他们的回答。

为什么我的变量在控制器中未定义？

3 个答案: