Угловое связывание с результатами функции

Question

Я прохожу через гид по угловому.и и наткнулся на the section on the NgClass directive. В приведенном примере источника ngClass' является функцией компоненты:

// HTML 
<div [ngClass]="setClasses()">This div is saveable and special</div> 

// Controller 
setClasses() { 
    let classes = { 
    saveable: this.canSave,  // true 
    modified: !this.isUnchanged, // false 
    special: this.isSpecial,  // true 
    }; 
    return classes; 
} 

Не создает ли это большие накладные расходы в течение цикла дайджеста с учетом директива не знает, когда результат функции изменился и бы инициировать новую оценку функции в течение каждого цикла дайджеста? В контраста я ожидаю, что следующий код обеспечит ту же функциональность , но только для переоценки, когда одно из наблюдаемых значений изменилось на (canSave, isUnchanged, isSpecial).

<div [ngClass]="{ saveable : canSave, modified : !isUnchanged, special: isSpecial }">This div is saveable and special</div> 

Может кто-нибудь пролить некоторый свет на то, что я должен принимать во внимание, чтобы Оптимизировать? Пример использования случае будет иметь этот ngClass на ngRepeat, который создает ~ 200 элементов на видимой странице.

В качестве бокового узла и меньшего вопроса мне было интересно, есть ли какой-нибудь хороший ресурс , чтобы узнать о единовременной привязке (в угловом2 против углового1). Руководство по , похоже, не охватывает это, и я надеялся получить асинхронный код времени , доступный в угловом2.

Answer 1

Не создает ли это большие накладные расходы в течение цикла дайджеста, учитывая, что директива не знает, когда результат функции изменился и вызовет новую оценку функции в течение каждого цикла дайджестов? В отличие от этого, я ожидаю, что следующий код предоставит те же функциональные возможности, но только переоценку, когда изменилось одно из наблюдаемых значений (canSave, isUnchanged, isSpecial).

Ваш вывод верен.

Метод setClasses возвращает другой экземпляр для каждого вызова, что делает сравнение в ngClass более дорогостоящим. Если тот же экземпляр возвращается, если никакая зависимость не изменилась, тогда привязка к методу в порядке.

Это было рассмотрено совсем недавно. https://github.com/angular/angular.io/issues/3072

В узле боковой и меньший вопрос мне было интересно, если есть хороший ресурс, чтобы узнать об одном времени связывания (в angular2 против angular1). Направляющий выступ, кажется, не охватывает это, и я надеялся получить асинхронное однократное связывание, доступное в угловом2.

Angular2 не поддерживает одноразовую привязку.