Question

给出下面的对象 -

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>

我有一个名单必须在列表中显示的人员列表。现在我将在没有任何细节的情况下加载数据，在这种情况下，人员的资格。

当有人点击此人的姓名时，我会检索此人的详细信息。我想改变模型，即将资格详细信息添加到该人的模型，然后设置角度以创建DOM。

控制此方法的一种方法是使用ng-show，并设置其表达式，以便它只显示限定div，如果限定对象具有值。然而，这也将导致为每个人创建细节div，从而对性能不利。

当表达式求值为true或false时，是否有一种方法可以通过angular创建/销毁dom？

Answer 1

如果我们想有条件地物理删除/添加DOM的一部分，ng-switch指令系列（ng-switch，ng-switch-when，ng-switch-default）会派上用场。

Answer 2

如果细节数据很小，并且获得它的成本不高，或者是否允许当前用户看到它的规则，那么我会说渲染它并且最初隐藏它。保持折叠只是让用户不要考虑那个细节，除非他们想要它用于某些记录。

如果它很大，或者检索/计算成本很高，或者有规则禁止某些用户看到某些细节，那就不同了。在这种情况下，我只渲染“按钮”来访问它，并在请求时通过ajax加载细节。

使用模型以角度创建主细节

2 个答案: