angular重要指令ngfor
通过一个顶部导航栏看下一ngfor的使用。上代码
ngfor指令 可以拿到menus中的 index索引 是否为第一个 是否为最后一个 上述代码我们给第一个 最后一个 选中分别给3种样式
.active {color: red;
}
.first{color: blue;
}
.final{color: yellow;
}
效果如下
menus中的数据如下
selectedIndex = -1;menus: TopMenu[] = [{title: '热门',link: ''},{title: '男装',link: ''},{title: '百货',link: ''},{title: '运动',link: ''},{title: '手机',link: ''},{title: '家纺',link: ''},{title: '食品',link: ''},{title: '电器',link: ''},];
完整demo可参考github自行下载
https://github.com/lee727n/angularLearning
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!