AngularJS ng-model 使用 Controller As 和 Typescript 来填充选择答案

【问题标题】：AngularJS ng-model using Controller As and Typescript to Populate selectionAngularJS ng-model 使用 Controller As 和 Typescript 来填充选择
【发布时间】：2016-10-30 22:51:14
【问题描述】：

我是编码新手。我正在处理一些使用 Angular、Typescript 和 Controller As 而不是范围的代码，并且找不到任何不使用 $scope.something 的示例。

我目前有一个带有多个选项的弹出菜单。选择一个选项时，它会打开一个显示空选择输入框的滑块。我希望通过分配给输入框的弹出菜单中的选择来打开滑块。

目前在我的 HTML 中：

<select name="entryTypes" ng-model="vm.entry.type">
    <option value="option1">Option One</option>
    <option value="option2">Option Two</option>
    <option value="option3">Option 3</option>
</select>

我想将我的选项放在我的控制器中。我认为 ng-options 是如何做到这一点的，但我不知所措。

【问题讨论】：

使用控制器中的选项创建一个数组，然后使用 ng-options 在 html 中遍历它。这很容易，并且有数百个示例。只需将scope 更改为您在controllerAs 中设置的名称

标签： angularjs typescript angular-ngmodel angularjs-ng-options

【解决方案1】：

尝试使用ng-options 指令，在你的controller：

$scope.items = [{
  id: 1,
  label: 'Option One',
  subItem: { name: 'aSubItem' }
}, {
  id: 2,
  label: 'Option Two',
  subItem: { name: 'bSubItem' }
}];

还有 HTML：

<select ng-options="item as item.label for item in items track by item.id" ng-model="selected"></select>

【讨论】：