2016-11-22 63 views
0

私はIonic-appで作業しています。 私のページの1つでは、要素をdiv要素に動的に追加しています。 要素が追加されましたが、ページに表示されません。F5をクリックしてコントローラコードを実行した直後に、私はそれらを見ることができます。要素の動的追加後にDiv要素が更新されない

if ($scope.eigenschaften != null) { 
     //TODO Eigenschaften in Loop durchgehen und auf panel_dynamic Controls erzeugen 
     var panel_dynamic = document.getElementById('panel_dynamic'); 
     if (panel_dynamic.hasChildNodes()) { 
      panel_dynamic.removeChild(panel_dynamic.childNodes[0]); 
     } 
     var content = document.createElement('div'); 
     for (n = 0; n <= $scope.eigenschaften.length - 1; n++) { 
      // Creates a new div with controls 
      var line = document.createElement('div'); 
      var para = document.createElement('p'); 
      // Creates a div-row 
      var div_row = document.createElement('div'); 
      div_row.setAttribute('class', 'row'); 
      // Creates a div-col with label 
      var div_col_label = document.createElement('div'); 
      div_col_label.setAttribute('class', 'col'); 
      div_col_label.appendChild(CreateLabel('font-size:16px;font-weight:bold;', $scope.eigenschaften[n].name)); 
      div_row.appendChild(div_col_label); 
      // Creates a div-col with control 
      var div_col_control = document.createElement('div'); 
      div_col_control.setAttribute('class', 'col'); 
      div_col_control.appendChild(CreateTextbox()); 
      div_row.appendChild(div_col_control); 
      // Adds the div-row to the para 
      para.appendChild(div_row); 
      // Adds the new para to the line 
      line.appendChild(para); 
      // Adds the new line to the content 
      content.appendChild(line); 
     } 
     // Adds the content-div to panel_dynamic 
     panel_dynamic.appendChild(content); 
    } 

「eigenschaften」データを持つ配列である:

ここ要素を追加するためのコードです。

答えて

0

残念ながら私は別のテンプレートでもcontainer-div "panel_dynamic"のIDを使用しました。 JavaScriptはgetElementByIdによって他のdivを取得していました。今私はidsを変更し、それが動作します。

0

変更検知がトリガーされていないようです。テンプレート内のng-repeatを使用して要素を追加する必要があります。この要素は、配列やその他のモデルの繰り返し可能な要素にバインドされています。次に、iterableに新しいものを追加するたびに、ビューに追加されます。

関連する問題