离子模板解析错误、离子选择、npm 和离子版本

Question

我收到错误： ion-select-option' 不是已知元素。

这行得通：

  <ion-item>
    <ion-label>Gender</ion-label>
    <ion-select placeholder="Select One">
      <ion-option value="f">Female</ion-option>
      <ion-option value="m">Male</ion-option>
    </ion-select>
  </ion-item>

但这不起作用：

  <ion-item>
    <ion-label>Gender</ion-label>
    <ion-select placeholder="Select One">
      <ion-select-option value="f">Female</ion-select-option>
      <ion-select-option value="m">Male</ion-select-option>
    </ion-select>
  </ion-item>

(ion-option 确实会弹出单选按钮，我正在寻找一个不会弹出的 Ionic 表单选择选项，但其作用类似于常规 HTML 单表单选择。我不确定 Ionic 是否提供这样一个选项，这就是我尝试离子选择选项的原因。）

在不同论坛上进行一些研究后，我看到建议我应该将我的 Ionic 更新到 4.0+ 以便能够使用 ion-select-option。

我是 npm 新手，很困惑。当我运行 npm outdated 时，我看到我正在运行 @ionic-native/core 4.4.0：

#npm outdated
Package                            Current  Wanted  Latest  Location
@ionic-native/core                   4.4.0  4.20.0  5.18.0  cart

但是当我得到错误：模板解析错误和离子版本时，在浏览器页面的底部，它给了我这些版本信息：

Ionic Framework: 3.9.2 
Ionic App Scripts: 3.2.4
Angular Core: 5.0.3

非常感谢您对此提供的任何帮助。

1. 为什么在浏览器底部（出现错误时）说我正在运行 Ionic Framework 3.9.2，但是当我运行 npm outdated 时，却显示我正在运行 @ionic-native/core 4.4 .0?
2. Ionic 是否提供类似于 HTML 选择而不是弹出单选按钮的选择选项？

Answer 1

您正在使用 ionic 3。

示例 ionic-v3 ion-select:

<ion-item>
  <ion-label>Gender</ion-label>
  <ion-select>
    <ion-option value="f">Female</ion-option>
    <ion-option value="m">Male</ion-option>
  </ion-select>
</ion-item>

示例 ionic-v4 ion-select:

  <ion-item>
    <ion-label>Gender</ion-label>
    <ion-select placeholder="Select One">
      <ion-select-option value="f">Female</ion-select-option>
      <ion-select-option value="m">Male</ion-select-option>
    </ion-select>
  </ion-item>

在 ionic 3 和 4 中，两者都有不同的组件，它们不能相互配合。如果您想更新 ionic，请使用此 cmd：

npm i -g ionic

或者想安装特定版本试试这个

npm i -g ionic@here your version number 

例如：npm i -g ionic@4.12

但在您的情况下，您使用的是 ionic-v3.9.2。所以你可以使用ionic 3，很好，v3.9是一个稳定的版本。