AngularJS--day03-取数组数据循环不重复

复制代码
<!DOCTYPE html>
<html ng-app='app' ng-controller='mainController'>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="angular.js"></script>
    </head>
    <body>
        <ul>
            <li ng-repeat='pname in names'>{{pname}}</li>
        </ul>
        <div ng-repeat='info in bookInfos trank by $index'>
            <p>书名:{{info.bookName}}</p>
            <p>作者:{{info.author}}</p>
        </div>
        <script>
            //页面数据模型
            var app = angular.module('app',[]);
            //实现html标签的控制器
            app.controller('mainController',['$scope',function($scope){
                $.scope.names = ['666','55','333','22'];
                $.scope.bookInfos = [
                    {bookName:'js入门',author:'frank'},
                    {bookName:'js精通',author:'frank'},
                ];
            }]);
            /*
              ng-repeat:重复创建标签遍历指令
              <li ng-repeat='pname in names track by $index'>{{panme}}</li>
              track by $index---不介意有重复元素
              */
        </script>
    </body>
</html>
复制代码

 

posted @   小白咚  阅读(298)  评论(0)  编辑  收藏  举报
编辑推荐：
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识（上）
· 浏览器原生「磁吸」效果！Anchor Positioning 锚点定位神器解析
阅读排行：
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布：重大改进与新特性概览！
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 单线程的Redis速度为什么快？
点击右上角即可分享
微信分享提示
AI FOR CODE 大赛