Question

我使用samge ngModel有两个对象。

<ion-item [hidden]="customerListEnabled">
  <ion-label stacked>Customer Name or Destination</ion-label>
  <ion-input ng-required='!customerListEnabled' type="text" name="patient-name" maxlength="30" [(ngModel)]='visit.patientName'></ion-input>
</ion-item>

<ion-item [hidden]="!customerListEnabled">
  <ion-label stacked>Customer Name or Destination</ion-label>
  <ion-select ng-required='customerListEnabled' #customer (ionChange)="changeCustomer(customer.value)" name='patient-name' [(ngModel)]='visit.patientName'>
    <ion-option *ngFor="let item of patients" value="{{item.patient_name}}">{{item.patient_name}}</ion-option>
  </ion-select>
</ion-item>

有些条件会显示一个或另一个，但不会同时显示两个。如您所见，它们都具有相同的[（ngModel）]。出于某种原因，即使仅在选择中指定了事件changeCustomer()，在输入项中也将调用事件using DotNetNuke.Web.Mvc.Routing; using RouteParameter = System.Web.Http.RouteParameter; namespace CodeWompler.CW.GridTest { public class RouteConfig : IMvcRouteMapper { public void RegisterRoutes(IMapRoute mapRouteManager) { mapRouteManager.MapRoute( moduleFolderName:"CW.GridTest", routeName: "CW.GridTest", url: "{controller}/{action}/{id}/{userid}/{itemid}", defaults: new { id=RouteParameter.Optional, userid=RouteParameter.Optional, itemid=RouteParameter.Optional }, namespaces: new[] {"CodeWompler.CW.GridTest.Controllers"}); } } }。我知道它们都具有相同的名称，因此我尝试将它们更改为唯一的名称，但我仍然遇到相同的问题。知道是什么原因造成的吗？

Answer 1

使用*ngIf代替hidden，因为hidden只会隐藏dom，而不会从视图中完全删除它。

<ion-item *ngIf="!customerListEnabled">
  <ion-label stacked>Customer Name or Destination</ion-label>
  <ion-input ng-required='!customerListEnabled' type="text" name="patient-name" maxlength="30" [(ngModel)]='visit.patientName'></ion-input>
</ion-item>

<ion-item *ngIf="customerListEnabled">
  <ion-label stacked>Customer Name or Destination</ion-label>
  <ion-select ng-required='customerListEnabled' #customer (ionChange)="changeCustomer(customer.value)" name='patient-name' [(ngModel)]='visit.patientName'>
    <ion-option *ngFor="let item of patients" value="{{item.patient_name}}">{{item.patient_name}}</ion-option>
  </ion-select>
</ion-item>

ionChange在两个对象上被调用，但仅在其中一个上被声明

1 个答案: