如何在angular5中使用ng-switch实现单选按钮？

Question

使用 angular5，我在互联网上找到了这段代码，我尝试运行它，因为我想在我的应用程序中使用同样的东西，它没有按预期工作，问题是我可以检查所有的单选按钮，甚至在选择任何单选按钮元素之前我都可以看到第一条消息。

<form>
      Pick a topic:
      <input type="radio" ng-model="myVar" value="dogs">Dogs
      <input type="radio" ng-model="myVar" value="tuts">Tutorials
      <input type="radio" ng-model="myVar" value="cars">Cars
    </form>

    <div ng-switch="myVar">
      <div ng-switch-when="dogs">
         <h1>Dogs</h1>
         <p>Welcome to a world of dogs.</p>
      </div>
      <div ng-switch-when="tuts">
         <h1>Tutorials</h1>
         <p>Learn from examples.</p>
      </div>
      <div ng-switch-when="cars">
         <h1>Cars</h1>
         <p>Read about cars.</p>
      </div>
    </div>

知道为什么这对我不起作用吗？我没有导入任何库来处理这个例子。

这是我在这个例子中使用的 link，但它对我不起作用，因为在 link 中。

Answer 1

您可以使用 angular

执行以下操作

<input type="radio" value="dogs" name="comp" [(ngModel)]="radioValue"> A
<input type="radio" value="tuts" name="comp" [(ngModel)]="radioValue"> B
<input type="radio" value="cars" name="comp" [(ngModel)]="radioValue"> C

STACKBLITZ DEMO

如何在angular5中使用ng-switch实现单选按钮？

how to implement Radio Button with ng-switch in angular5?

angular

radio-button

angular5

frontend

ng-switch