选择返回未定义的AngularJS模型答案

【问题标题】：AngularJS model of select returns undefined选择返回未定义的AngularJS模型
【发布时间】：2014-06-18 21:10:14
【问题描述】：

我正在尝试检索 select 的当前选项的值，但它返回我未定义（我希望它返回我一个对象）。

标记：

<div ng-app ng-controller="MyCtrl">
    <select ng-model="selectedLocal" ng-options="item.Nome for item in locais" ng-change="localSelectChange()">
        <option value="">Locais</option>
    </select>
</div>

控制器：

function MyCtrl($scope) {
    $scope.locais = [{
        ID: 109,
        Nome: 'Aeroporto Internacional Hercilio Luz'
    }, {
        ID: 161,
        Nome: 'Koxixos'
    }, {
        ID: 184,
        Nome: 'Praça XV de Novembro'
    }];

    $scope.localSelectChange = function() {
        alert('$scope.selectedLocal: ' + $scope.selectedLocal); // returns undefined
    }
}

奇怪的是我创建了this jsfiddle 来重现问题，使用完全相同的代码，并且它可以工作。

更新：

我创建了一个 plunkr here 我复制了这个问题。

第一个选择被包装在一个带有自己的控制器“MyCtrl”的 div 上，它按预期工作，因为我能够从 ng-change 事件处理函数中检索模型。

第二个选择“属于”DashCtrl，整个Dash 选项卡视图控制器。当我尝试从 ng-change 事件处理函数中检索模型时，它返回未定义。这是为什么呢？

【问题讨论】：

查看应用程序中是否声明了 ng-app 和 ng-controller。还要验证 Angular 库是否包含在您的项目中。
-2 有什么原因吗？
返回 undefined 还是 [object object] ？
@TiagoBarreto 是的，这一切都已声明并包含在内。一切正常。选择填充有来自locais 对象等的数据。
@ryan，它返回未定义。

标签： javascript angularjs angularjs-controller angular-ngmodel

【解决方案1】：

尝试将“$scope.selectedLocal.Nome”改为“this.selectedLocal.Nome”；

当我尝试在控制器中使用包含时，我遇到了类似的错误...接缝范围丢失了。

【讨论】：

也帮了我，我也想知道：这里的$scope有什么问题？谢谢！

【解决方案2】：

您需要声明的对象值。

    $scope.localSelectChange = function() {
            alert('$scope.selectedLocal: ' + $scope.selectedLocal.Nome);
    }

见JSFiddle

【讨论】：

这就是我首先尝试的......它返回错误：TypeError: Cannot read property 'Nome' of undefined 因为 $scope.selectedLocal 未定义
@zok 给我看完整的代码，因为我不明白这个问题。

【解决方案3】：

我遇到了同样的问题，尝试在 ng-options 中使用“track by”

<div ng-app ng-controller="MyCtrl">
    <select ng-model="selectedLocal" ng-options="item.Nome for item in locais track by item.ID" ng-change="localSelectChange()">
        <option value="">Locais</option>
    </select>
</div>

【讨论】：