[すべて] Angular6問題レコード:ngDefaultControl



Angular6 Problem Record



入力コンポーネント無線を使用しますが、アセンブリエラーを使用すると、
画像
次に、ngDefaultControlを解くことで見つけることができます。
https://stackoverflow.com/questions/38978166/no-value-accessor-for-form-control-with-name-recipient
しかし、ブラウザの互換性の問題、低バージョンのGoogleと360ブラウザでは、ラジオをクリックしても応答がありません
コンポーネントコード:
radio.component.ts

import {Component, Input} from '@angular/core' @Component({ selector: 'radio', templateUrl: './radio.component.html', styleUrls: ['./radio.component.css'] }) export class RadioComponent { @Input() name: string @Input() value: any @Input() model: any }

radio.component.html



<div class='radio-box' [ngClass]='{'radio-active':value==model}'> <input type='radio' name='{{name}}' value='{{value}}'> <div class='radio-checked' *ngIf='value==model'>div> div>

radio.component.css

.radio-box { width: 20px height: 20px background: #fff border: 1px solid #dfe3eb border-radius: 50% position: relative padding: 0 display: inline-block } .radio-box input { width: 20px height: 20px position: absolute top: 0 left: 0 margin: 0 outline: none opacity: 0 z-index: 1000 } .radio-active { } .radio-checked { background: #ff893e width: 10px height: 10px position: absolute z-index: 999 top: 5px left: 5px border-radius: 50% }