首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >AngularJS ng-switch-when表达式

AngularJS ng-switch-when表达式
EN

Stack Overflow用户
提问于 2013-05-01 07:42:40
回答 1查看 11.6K关注 0票数 2

我正在尝试使用ng-switch来组合一种选项卡式菜单。

我在我的Ctrl (streams)中设置了标签,并将当前选择的标签记录为selection:

代码语言:javascript
复制
app.controller("StreamCtrl", function($scope) {
$scope.streams = [{
    title: 'latest',
    icon: 'time',
    data: "Hi, I'm data."
}, {
    title: 'popular',
    icon: 'fire',
    data: "Hi, I'm data too!"
}];

$scope.selection = $scope.streams[0];

$scope.getCurrentStreamIndex = function(){
    // Get the index of the current stream given selection
    return $scope.streams.indexOf($scope.selection);
};

// Go to a defined stream index
$scope.goToStream = function(index) {
    if($scope.streams[index]) {
        $scope.selection = $scope.streams[index];
    }
};
});

在我的视图(index.html)中,我使用ng-repeat为每个选项卡创建一个容器:

代码语言:javascript
复制
<section class="streams" ng-controller="StreamCtrl" ng-switch="stream.title == selection.title">
        <section class="stream" ng-switch-when="true" ng-repeat="stream in streams">
            {{stream.title}}
            <div class="loaderContainer"><div class="loader"></div></div>
        </section>
    </section>

我遇到的问题是我的ng-switch-when语句,因为它不接受表达式。

如果我可以设置ng-switch-when="{{stream.title}}",那么我相信我可以使用ng-switch="selection.title",一切都会好起来的。

我如何构造一个ng-switch表达式来匹配动态生成的列表呢?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-05-01 08:47:17

好了,看看这个,我认为它应该给你足够的继续下去的能力:

http://jsbin.com/okukey/1/edit

新的html:

代码语言:javascript
复制
  <div ng-controller="StreamCtrl">
  <section class="streams"  ng-repeat="stream in streams">
        <section class="stream">
            {{stream.title}}
            <div class="loaderContainer" ng-show="stream == selection"><div class="loader">SELECTED</div>
        </section>
    </section>
  </div>
票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16310684

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档