1

以下のオブジェクトが与えられた場合 -

function PersonCtrl(){ 
  $scope.persons = [{name: "Mike", age:21, 
                   occupation:{qualification: "engineer", company:"Intel"}}];  
}

そして以下のDOM -

<ul>
   <li ng-repeat="person in persons">
      Name : {{person.name}}
      <div ng-model="person.occupation">
        Qualification : {{person.occupation.qualification}}
      </div>
    </li>
</ul>

名前をリストに表示する必要がある人物のリストがあります。ここで、最初に詳細なしでデータを読み込みます。この場合は人の資格です。

誰かがその人の名前をクリックすると、その人の詳細が取得されます。モデルを変更したいだけです。つまり、資格の詳細をその人のモデルに追加し、Angular で DOM を作成したいと思います。

これを制御する 1 つの方法は、ng-show を使用し、その式を設定して、資格オブジェクトに値がある場合にのみ資格 div を表示することです。ただし、これにより、詳細 div がすべての人に対して作成されることにもつながり、パフォーマンスが低下します。

式が true または false に評価されたときに、角度によって dom が作成/破棄される方法はありますか?

4

2 に答える 2

2

DOM の一部を条件付きで物理的に削除/追加したい場合は、ng-switchディレクティブのファミリー (ng-switch、ng-switch-when、ng-switch-default) が便利です。

于 2012-12-06T12:12:18.340 に答える
0

詳細データが小さく、取得するのに莫大なコストがかからない場合、または現在のユーザーがそれを表示できるかどうかに関するルールがある場合は、レンダリングして最初に非表示にするだけです。折りたたんだままにしておくと、特定のレコードで必要にならない限り、ユーザーはその詳細について考えることができなくなります。

取得/計算するのが大きい、または費用がかかる場合、または一部のユーザーが特定の詳細を表示することを禁止するルールがある場合、それは異なります。その場合、アクセスするための「ボタン」のみをレンダリングし、要求に応じてajaxを介して詳細をロードします。

于 2012-12-06T12:39:58.383 に答える