Javascript 基于条件显示和隐藏html组件，而不使用div

我在做Angular JS项目。它有三个单选按钮，如下所示

    <div class="sys-form__field" 
     layout="row">
  <label class="sys-label sys-label--radio" flex flex-gt-xs="33">Choices</label>

  <input  type="radio"
          ng-model="booking.model.foodType"
          value="vegetarian"
          class="sys-input sys-input__radio"
          title="" />
  <md-button ng-click="booking.setRadio('foodType', 'vegetarian')">Vegetarian</md-button>
  <input  type="radio"
          ng-model="booking.model.foodType"
          value="vegan"
          class="sys-input sys-input__radio"
          title="" />
  <md-button ng-click="booking.setRadio('foodType', 'vegan')">Vegan</md-button>
  <input  type="radio"
          ng-model="booking.model.foodType"
          value="nonvegetarian"
          class="sys-input sys-input__radio"
          title="" />
  <md-button ng-click="booking.setRadio('foodType', 'nonvegetarian')">Non Vege</md-button>
</div>

---

但它显示了所有的单选按钮。请帮忙，你能试试这样的吗

 <input  type="radio"
        ng-model="booking.model.foodSize"
        value="small"
        title=""
        ng-show="booking.model.foodType == 'vegetarian'"> Small

<input  type="radio"
        ng-model="booking.model.foodSize"
        value="medium"
        title="" 
        ng-show="booking.model.foodType == 'nonvegetarian'"> Medium           

<input  type="radio"
        ng-model="booking.model.foodSize"
        value="large"
        title="" 
        ng-show="booking.model.foodType == 'nonvegetarian'"> Large

小
中等
大的

你能试试这样的吗

 <input  type="radio"
        ng-model="booking.model.foodSize"
        value="small"
        title=""
        ng-show="booking.model.foodType == 'vegetarian'"> Small

<input  type="radio"
        ng-model="booking.model.foodSize"
        value="medium"
        title="" 
        ng-show="booking.model.foodType == 'nonvegetarian'"> Medium           

<input  type="radio"
        ng-model="booking.model.foodSize"
        value="large"
        title="" 
        ng-show="booking.model.foodType == 'nonvegetarian'"> Large

小
中等
大的

首先，您应该避免将函数放在show/hide/if指令中，这会减慢应用程序的速度；您应该使用逻辑语句或布尔变量。您可以直接在输入上使用show/hide语句

<input
  ng-show="booking.model.foodType === 'vegetarian' || booking.model.foodType === 'nonvegetarian'"
  type="radio"
  ng-model="booking.model.foodSize"
  value="small"
  title=""> Small

<input
  ng-show="booking.model.foodType === 'nonvegetarian'"
  type="radio"
  ng-model="booking.model.foodSize"
  value="medium"
  title=""> Medium

<input
  type="radio"
  ng-model="booking.model.foodSize"
  value="large"
  title=""> Large

小
中等
大的

---

除此之外，您还可以使用其他变量在其中存储语句，并在用户单击按钮更改食物类型时进行更新。首先，您应该避免在show/hide/if指令中添加函数，这会降低应用程序的速度；您应该使用逻辑语句或布尔变量。您可以直接在输入上使用show/hide语句

<input
  ng-show="booking.model.foodType === 'vegetarian' || booking.model.foodType === 'nonvegetarian'"
  type="radio"
  ng-model="booking.model.foodSize"
  value="small"
  title=""> Small

<input
  ng-show="booking.model.foodType === 'nonvegetarian'"
  type="radio"
  ng-model="booking.model.foodSize"
  value="medium"
  title=""> Medium

<input
  type="radio"
  ng-model="booking.model.foodSize"
  value="large"
  title=""> Large

小
中等
大的

---

除此之外，您还可以使用其他变量在其中存储语句，并在用户单击按钮更改食物类型时更新这些语句

谢谢您的回答。但它不起作用。现在，比萨饼的尺寸首先显示出来。我想在点击按钮后显示它们。第二件事是它没有隐藏。它只隐藏单选按钮圈。我也试着添加一个标签是的，我理解，这是一个概念，你可以显示或隐藏你想要的任何东西，只需实现你需要的条件和ude模型。我知道这个概念是ng show，我在我的问题中还补充道：）没有从你那里找到一个好的答案。谢谢答案。但它不起作用。现在，比萨饼的尺寸首先显示出来。我想在点击按钮后显示它们。第二件事是它没有隐藏。它只隐藏单选按钮圈。我也试着添加一个标签是的，我理解，这是一个概念，你可以显示或隐藏你想要的任何东西，只需实现你需要的条件和ude模型。我知道这个概念是ng show，我在我的问题中还补充道：）没有从你那里找到一个好的答案。谢谢答案。但它不起作用。现在，比萨饼的尺寸首先显示出来。我想在点击按钮后显示它们。第二件事是它没有隐藏。它只隐藏单选按钮圈。我也试着添加一个标签嘿，只需在作用域上创建一个新变量，一旦用户点击按钮，它就会被更新。然后在显示整个部分的div中使用该变量，添加将包装输入的标签，并通过使用刚创建的变量检查哪种类型为pickedI创建变量为clickFoodType，将值初始化为false，在输入上放置show/hide语句。在foodTypeChoice中，我检查了用户是否选择了small，我将clickFoodType更改为true。然后在ng sho中加入了这个变量。问题仍然是sae，所有showsu都在吗@Dmitry UvarovWould会更好，如果你创造一个小提琴或类似的小例子，你能做到吗？谢谢你的答案。但它不起作用。现在，比萨饼的尺寸首先显示出来。我想在点击按钮后显示它们。第二件事是它没有隐藏。它只隐藏单选按钮圈。我也试着添加一个标签嘿，只需在作用域上创建一个新变量，一旦用户点击按钮，它就会被更新。然后在显示整个部分的div中使用该变量，添加将包装输入的标签，并通过使用刚创建的变量检查哪种类型为pickedI创建变量为clickFoodType，将值初始化为false，在输入上放置show/hide语句。在foodTypeChoice中，我检查了用户是否选择了small，我将clickFoodType更改为true。然后在ng sho中加入了这个变量。问题仍然是sae，所有showsu都在吗@Dmitry UvarovWould会更好，如果你创造一个小提琴或类似的小例子，你能做到吗？