将下拉菜单的编号存储为整数 AngularJS

Question

我有一个包含数字的下拉菜单。 菜单是这样的：

<div class="container-fluid">
        <label>Choose number</label>
        <select ng-model="visitors_list" id="visitors">
            <option class="dropdown-item" value="1">1</option>
            <option class="dropdown-item" value="2">2</option>
            <option class="dropdown-item" value="3">3</option>
            <option class="dropdown-item" value="4">4</option>
            <option class="dropdown-item" value="5">5</option>
        </select>
    </div>

我的目标是根据我的选择将所需的数字存储为整数。 例如，如果我选择 2，那么数字 2 将作为整数存储在变量中。 有什么办法可以做到吗？

Answer 1

如果我理解正确，这应该是您要查找的内容，在 html 中向您的选择器添加一个事件，如下所示（$event 将检索选定的值）：

<select ng-model="visitors_list" id="visitors" (change)="onSelect($event)"> 
        <option class="dropdown-item" value="1">1</option>
        <option class="dropdown-item" value="2">2</option>
        <option class="dropdown-item" value="3">3</option>
        <option class="dropdown-item" value="4">4</option>
        <option class="dropdown-item" value="5">5</option>
</select>

在你的打字稿中：

export class YourComponent {

  selectedNumber!: number; // Create a variable called selectedNumber and set it to null.


  constructor() {}

  ngOnInit() {}


/**
 * The function takes an event as an argument, and sets the selectedNumber property to the value of the
 * event's target.
 * @param {any} event - any - The event object
 */
  onSelect(event: any) {
    this.selectedNumber = event.target.value;
  }

}

现在您可以随意使用变量了，希望对您有所帮助