在angularjs中,这是根据根来组织显示和隐藏html代码的好方法吗?

Is this the good way to organize code for showing and hiding html depending on root in angularjs

本文关键字:代码 html 隐藏 方法 显示 angularjs      更新时间:2023-09-26

我在用angular做一个小测验。我的根目录是Questions/#/Questions/1

我有6个问题,根据根我显示和隐藏html的问题…目前我的代码看起来像这样

模板

<section ng-class="{active:isActive(1)}">
    Pitanje 1
</section>
<section ng-class="{active:isActive(2)}">
    Pitanje 2
</section>
<section ng-class="{active:isActive(3)}">
    Pitanje 3
</section>
<section ng-class="{active:isActive(4)}">
    Pitanje 4
</section>
<section ng-class="{active:isActive(5)}">
    Pitanje 5
</section>
<section ng-class="{active:isActive(6)}">
    Pitanje 6
</section>

问题控制器

$scope.isActive = function(question) {
    return question === Number($routeParams.id);
}

是否有办法不使用硬编码索引的部分?更像是jQuery索引。

为什么不使用ng-repeat$index来设置这个?

在控制器中添加类似 的内容
$scope.questionsNumber = new Array(6)

在模板中更改为(Psuedo代码,未测试,查看ng-repeat文档了解详细信息):

   <section ng-repeat="i in questionsNumber track by $index" ng-class="{active:isActive($index)}">
       Pitanje {{$index}}
   </section>

您可能想要/需要使用函数而不是questionsNumber,如本问题所述