2016-12-19 2 views
0

Validate, если флажок должен отображаться в HTML-страницу:Aurelia обновления зависимостей свойств

get canPerformCommand() { 
    let r = false; 
    let valids = ['Success', 'Error']; 

    if (this.requests.length == 0) return false; 

    if (valids.indexOf(this.myresult[0].requestStatus) > 0) { 
     r = true; 
    } 
    return r; 
} 

Html страницы:

<span if.bind="canPerformCommand" class="panel-heading-buttons"> 
    <button click.trigger="confirm()">Confirm</button> 
</span> 

Поиск:

return this.myService.getRequests() 
     .then(data => { 
      this.requests = data 

      //Somehow refresh canPerformCommand here? 
     }); 

this.requests будет пустым на первой странице нагрузки, в результате чего canPerformCommand = false. Я хочу обновить canPerformCommand при использовании функции поиска.

В настоящее время canPerformCommand не обновит себя после того, как поиск выполнен.

Как обновить canPerformCommand после поиска, используя Зависимости от свойств?

+0

Может быть, computedFrom ответ? http://aurelia.io/hub.html#/doc/article/aurelia/binding/latest/binding-computed-properties/1 – Reft

+0

В конце концов, смогли ли вы решить эту проблему? Что сработало для вас? – LStarky

+0

См. Мой ответ – Reft

ответ

0

я заменил:

if (valids.indexOf(this.myresult[0].requestStatus) > 0) { 
    r = true; 
} 

С

if (valids.includes(this.requests[0].requestStatus)) { 
    r = true; 
} 

И теперь он работает. Я также использовал функцию indexOf на других страницах, и, как ни странно, это работало на большинстве из них. Должно быть, в моей модели было что-то не так.

Кроме того, я согласен, что было бы лучше использовать computedFrom.

0

Решение:

Самый простой и наиболее логичным решением было бы изменить canPerformCommand на две отдельные объекты - переменная флага и функции. Сделайте переменную флага canPerformCommand и сохраните if.bind=canPerformCommand, но измените название вашей функции на updateCanPerformCommand(), чтобы вы могли легко вызвать эту функцию из своей функции return this.myService.getRequests().then.

Детали:

Настройка вашего вида-модели, как это:

export class App { // <-- (or whatever yours is called) 
    canPerformCommnad = false; 

    constructor() { 
    // ... 
    } 

    updateCanPerformCommand() { 
    let r = false; 
    let valids = ['Success', 'Error']; 

    if (this.requests.length == 0) { 
     this.canPerformCommand = false; 
    } else if (valids.indexOf(this.myresult[0].requestStatus) > 0) { 
     this.canPerformCommand = true; 
    } 
    } 
} 
0

Я считаю, что вам нужно изменить myresult к requests в canPerformCommand добытчика:

get canPerformCommand() { 
    let r = false; 
    let valids = ['Success', 'Error']; 

    if (this.requests.length == 0) return false; 

    if (valids.indexOf(this.requests[0].requestStatus) > 0) { 
     r = true; 
    } 
    return r; 
} 

С этот геттер будет грязно проверен Aurelia, он будет называться каждые 200 мс. Чтобы избежать этого, вы можете добавить computedFrom декоратора:

import {computedFrom} from 'aurelia-framework'; 

export class MyClass { 

.... 

    @computedFrom('requests') 
    get canPerformCommand() { ....