Как оптимизировать вызовы метода в визуальном компоненте Angular - PullRequest
0 голосов
/ 19 октября 2018
       <ng-container *ngFor="let child of root.getChildren()">
       <ng-container *ngIf hasProperty(child)>
         <div>{{getProperty(child)}}</div>
       </ng-container>

       component{
        @input()
         root;
        hasProperty(node){
         console.log("in hasProperty");
          return node.getPropertiesMap.has("property");
         }
         getProperty(node){
         console.log("in getProperty");
          return node.getPropertiesMap.get("property");
         }
        }

DataStructure:

root / |\ abc

  1. Я использую для зацикливания и для проверки условий, поскольку я не хотел создавать ненужные элементы DOM, это оправдано?или есть какой-либо лучший метод?

2. Для каждого дочернего элемента корня, если дочерний элемент имеет свойство, я должен распечатать свойство дочернего элемента (это выполняется путем интерполяции строк).Но в console.log я мог видеть, что методы hasProperty () и getProperty () вызываются более двух раз для каждого дочернего элемента (из-за инициирования изменения).Есть ли лучшая практика для сокращения этих ненужных вызовов методов?или это нормально иметь эти ненужные звонки?

 Console Log:
 in hasProperty true
 in getProperty

 in hasProperty true
 in getProperty

 in hasProperty true
 in getProperty 
/* method calls because of change initiation*/
 in hasProperty true
 in getProperty
 in hasProperty true
 in getProperty
 in hasProperty true
 in getProperty
...