为什么无线电样式按钮不能以反应形式切换自举角7不起作用

Posted 2021-04-23

嗨我在我的角度7应用程序中使用无线电样式按钮切换自举，但是不工作，当我使用简单的收音机工作正常但当我使用无线电样式按钮切换不起作用我在我的应用程序中执行此操作

<link rel="stylesheet"href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"</script>

<div class="btn-group btn-group-toggle" data-toggle="buttons">
    <label class="btn btn-secondary">
    <input type="radio" 
    name="single" id="option1" formControlName="single" value="yes"  > yes
    </label>
    <label class="btn btn-secondary">
    <input type="radio" name="single" id="option2" formControlName="single"    
    value="no"> no
    </label>
</div>

<p>Form value: {{ form.value | json }}</p>

这工作

难道我做错了什么？

答案

如果您担心应用程序中尚未安装bootstrap，请尝试按以下方式进行设置。通过测试一个简单的弹性盒就可以确保它首先运行起来是明智的。

<div class="d-flex"></div>

以上是否延长了屏幕的范围并在chrome元素控制台中具有css属性？

npm install bootstrap // in terminal

在src / styles.css中插入以下内容：

@import "~bootstrap/dist/css/bootstrap.css";

这种方式可能比所有链接都更整洁，但无论哪种方式都是最好的。我认为您已正确设置单选按钮，未通过我的建议评论，并会仔细检查无线电。 BR