Aurelia Validation - одно из двух полей должно быть обязательным

Question

<div class="row"> 
    <div class="col-sm-6"> 
     <div class="form-group"> 
      <label class="control-label">SKU</label> 
      <input disabled.bind="readonly" type="text" class="form-control" value.bind="production.Sku1"> 
     </div> 
    </div> 
    <div class="col-sm-6"> 
     <div class="form-group"> 
      <label class="control-label">SKU</label> 
      <input disabled.bind="readonly" type="text" class="form-control" value.bind="production.Sku2"> 
     </div> 
    </div> 
</div> 

У меня есть текстовые поля выше, либо sku1 должен быть обязательным, либо sku2. Я знаю, как сделать это в том, что кажется всем, кроме Аурелии.

Я надеялся, что это будет что-то простое, как

this.validator = this.validation.on(this) 
    .ensure('production.StockStatusId').isGreaterThan(0).withMessage('is required') 
    .ensure('production.Sku1').isNotEmpty().Or.ensure('production.Sku2').isNotEmpty(); 

я затрагивал, если заявления, но не уверены, что computedFrom будет

UPDATE

Я надеялся, что это будет работать, однако это не так. Кто-нибудь знает, почему?

.ensure('production.Sku1', (config) => {config.computedFrom(['HasProvidedEitherSku'])}) 
.passes(() => { return this.HasProvidedEitherSku }).withMessage("(Need to provide a SKU)") 

get HasProvidedEitherSku(){ 
    if ((this.production.Sku1 === undefined || this.production.Sku1 === null) && (this.production.Sku2 === undefined || this.production.Sku2 === null)){ 
     return false; 
    } else { 
     return true; 
    } 
} 

UPDATE

Это делает работу, таким образом. Однако обе показывают ошибку сразу, однако ошибка очищается только от той, которая стала действительной. Я понимаю, почему, как сообщение об ошибке прилагается к каждому один сен, однако я не знаю, как остановить этот

   .ensure('production.Sku1', (config) => {config.computedFrom(['HasProvidedEitherSku'])}) 
       .if(() => { return this.HasProvidedEitherSku }) 
        .isNotEmpty().withMessage('a SKU is required') 
       .endIf() 
       .ensure('production.Sku2', (config) => {config.computedFrom(['HasProvidedEitherSku'])}) 
       .if(() => { return this.HasProvidedEitherSku }) 
        .isNotEmpty().withMessage(‘a SKU is required') 
       .endIf(); 

Answer 1

Вот что я использовал:

HTML

<div class="col-sm-6"> 
     <div class="form-group"> 
      <label class="control-label">SKU</label> 
      <input disabled.bind="readonly" type="text" class="form-control" value.bind="Sku1"> 
     </div> 
    </div> 
    <div class="col-sm-6"> 
     <div class="form-group"> 
      <label class="control-label"> SKU</label> 
      <input disabled.bind="readonly" type="text" class="form-control" value.bind="Sku2"> 
     </div> 
    </div> 

Подтверждение

    .ensure('Sku1', (config) => {config.computedFrom(['Sku1, Sku2'])}) 
        .if(() => { return this.HasProvidedEitherSku1OrSku2 === false }) 
         .isNotEmpty().withMessage(‘at least one sku is required') 
         .hasLengthBetween(0, 50) 
        .endIf()      
        .ensure('Sku2', (config) => {config.computedFrom(['Sku1, Sku2'])}) 
        .if(() => { return this.HasProvidedEitherSku1OrSku2 === false }) 
         .isNotEmpty().withMessage(‘at least one sku is required’) 
         .hasLengthBetween(0, 50) 
        .endIf(); 

Метод валидации

get HasProvidedEitherSku1OrSku2(){ 
    if ((this.Sku1 === undefined || this.Sku1 === null || this.Sku1 === '') && (this.Sku2=== undefined || this.Sku2=== null || this.Sku2=== '')){ 
     return false; 
    } else { 
     return true; 
    } 
}