The change of the variable cannot be displayed in the template through the two-way binding of the variable in the component of the form. -sharpangular

I want to dynamically display the next form by changing the value of isDataRequest, but the actual isDataRequest value will change, but the template will not change. The value of each change is stored through subject, and then subscribed in the template, so that the template will be displayed dynamically. Why is it useless to bind variables directly? for details, please see stackblitz

. 
<nz-form-item class="dct-col-24">
              <nz-form-label nzSpan="8"></nz-form-label>
              <nz-form-control nzSpan="16">
                <nz-radio-group [(ngModel)]="isDataRequest" (ngModelChange)="testChange($event)">
                  <label nz-radio nzValue="0"></label>
                  <label nz-radio nzValue="1"></label>
                </nz-radio-group>
              </nz-form-control>
            </nz-form-item>
              <nz-form-item class="dct-col-24" *ngIf="!isDataRequest">
                <nz-form-label nzSpan="8"></nz-form-label>
                <nz-form-control nzSpan="16">
                  <nz-select nzAllowClear [(ngModel)]="defaultValue">
                    <nz-option [nzLabel]=""test1"" [nzValue]="1">
                    </nz-option>
                    <nz-option [nzLabel]=""test2"" [nzValue]="2">
                    </nz-option>
                  </nz-select>
                </nz-form-control>
              </nz-form-item>

              <nz-form-item class="dct-col-24" *ngIf="isDataRequest">
                <nz-form-label nzSpan="8"></nz-form-label>
                <nz-form-control nzSpan="16">
                  <input nz-input [(ngModel)]="defaultValue">
                </nz-form-control>
              </nz-form-item>

the environmental background of the problems and what methods you have tried

related codes

/ / Please paste the code text below (do not replace the code with pictures)

what result do you expect? What is the error message actually seen?

Angular
Jun.11,2021

because the judgment problem here * ngIf= "! isDataRequest"
selects this < label nz-radio nzValue= "0" > default value < / label >, that is, nzValue= "0". Note that at this time isDataRequest ='0' , it is string 0, not the number 0 . Here you can do an experiment, set isDataRequest = 0 in ts, and see if the page selects the 'default' option, and then isDataRequest = '0values. Take a look at the page again.

The result of

!'0' (! isDataRequest) is false, so your form will always show input, instead of select.

Previous: Huawei mobile phone installation we developed app prompt signature error

Next: When the page content is printed with the Echars chart, the chart does not display

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1ea6820-5cbfc.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1ea6820-5cbfc.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?