gpt4 book ai didi

javascript - 在AngularJS中将ng-click值初始化为true

转载 作者:行者123 更新时间:2023-11-28 18:29:48 25 4
gpt4 key购买 nike

我正在使用 Angular 的 spa,我使用 ng-click 在页面之间切换(通过显示和隐藏 div)。一切正常,这是我正在使用的代码的简化版本:

<a href="" ng-click="first=true; second=false; third=false">First</a>
<a href="" ng-click="first=false; second=true; third=false">Second</a>
<a href="" ng-click="first=false; second=false; third=true">Third</a>

<div class="container" id='settings' ng-show='first'> First </div>
<div class="container" id='settings' ng-show='second'> Second </div>
<div class="container" id='settings' ng-show='third'> Third </div>

但是,最初没有显示任何 div - 因为没有单击任何链接。我希望首先显示第一页,然后在单击另一个链接时隐藏。我怎样才能做到这一点?

最佳答案

我想提出完全适合您的情况的 ng-repeatng-switch 指令的不同解决方案组合

代码

$scope.items = [
{id: 1, name: 'First'},
{id: 2, name: 'Second'},
{id: 3, name: 'Third'},
];

$scope.model = { selected: 1};

HTML

<body ng-controller="MainCtrl">
<a href="" ng-click="model.selected = item.id" ng-repeat="item in items">
{{item.name}}
</a>

<div class="container" id='settings' ng-switch='model.selected'>
<div ng-switch-when="1"> First </div>
<div ng-switch-when="2"> Second </div>
<div ng-switch-when="3"> Third </div>
</div>
</body>

Demo Plunkr

关于javascript - 在AngularJS中将ng-click值初始化为true,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38294763/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com