Изменение свойства не отражается в пользовательском интерфейсе, когда оно установлено из функции dom-repeat - Polymer

Question

У меня есть массив объектов и свойства, моя структура dom-repeat выглядит как показано ниже

     <template is="dom-repeat" items="{{arrayOfObj}}">              //first dom repeat      
       <span>[[myProperty]]<span> //here also its not updating      
        <template is="dom-if" if="[[_checkSomeCondition()]]">    //calling method from dom-if
          <span>[[myProperty]]<span>     //here its not getting updated value
        </template>
     </template>

У меня есть собственность

 properties:{
 myProperty:{
  type:Boolean
 }
}

моя функция вызывается каждый раз, когда повторяется dom-repeat

 _checkSomeCondition:function() {  //I'll check and set property
  if(some condition){
     this.myProperty = true;
     return true;
   }
   else{
     this.myProperty = false;
     return true;
   }
 console.log(this.myProperty); //I'll get the updated value on console
}

но его не меняется на экране! Он будет отображать любые данные, которые он установил в первый раз внутри _checkSomeCondition!! но в консоли его обновление

Для тестирования я вставил кнопку и после того, как все dom-repeat визуализировалось при нажатии на эту кнопку, я вызвал какую-то функцию, там когда я менял значение, оно отражалось везде

    this.myProperty = true;

но почему это не работает, когда значение изменяется внутри функции, которая вызывается dom-repeat?? Я перепробовал все 3 способа обновления объекта

Плункер: https://plnkr.co/edit/iAStve97dTTD9cv6iygX?p=preview

Answer 1

Установка переменной через this.myValue = 'somevalue'; не будет обновлять привязку.

Лучше всего устанавливать переменные через this.set('variablename', 'variablevalue');

Вы также можете, после установки свойства через this.variablename = 'variablevalue'; this.notifyPath('variablename');

Answer 2

Пытаться

<template is="dom-if" if="[[_checkSomeCondition(myProperty)]]">    //calling method from dom-if
    <span>[[myProperty]]<span>   //here its not getting updated value
</template>

А потом

_checkSomeCondition: function(property) {

Answer 3

Я изменил ваш код, как показано ниже. Я не уверен, поможет ли это вашему сенарио. Пожалуйста, посмотрите, может помочь привести идеи

<template is="dom-repeat" items="{{sensor.Sensor.Contaminants}}" index-as="index"> <span>{{myProperty}}<span> //here also its not updating
<div>{{_checkSomeCondition(index)}}<div> //here its not getting updated value </template>

И ваш _checkSomeCondition Метод будет:

_checkSomeCondition: function() { //I'll check and set property console.log(index); if(<your condition>){ this.myProperty = 'true'; } else{ this.myProperty = 'false'; } // Return whatever you want to show in UI return this.myProperty; console.log(this.myProperty); //I'll get the updated value on console },

и ваш myProperty должен уведомить об изменениях. Так что собственность должна иметь notify: true,

С помощью этого кода я мог видеть изменения в пользовательском интерфейсе, как и ожидалось. Дайте мне знать, если это поможет