音乐table

来源:互联网 发布:淘宝鹏飞运动怎么样 编辑:程序博客网 时间:2024/05/03 18:12
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            tr td{
                border: 1px solid black;
                margin: 1px;
            }
        </style>
        <script src="libs/angular.min.js" ></script>
        <script src="libs/angular-route.js" ></script>
        <script>
            angular.module("myApp", ["ngRoute"])
                .config(function($routeProvider) {
                    $routeProvider.when("/:path",{
                        
                        templateUrl: "play_music.html",
                        controller: "demoA"
                    })

                }).controller("demoC", function($scope,  $http) {
                    
                    $http.get('sings.json').success(function(resp) {
                        $scope.sings=resp;
                        
                    })
                }).controller("demoA",function($scope,$routeParams){
                    $scope.path=$routeParams.path;
                });
        </script>
    </head>
    <body ng-app="myApp" ng-controller="demoC">
        <table>
            <thead></thead>
            <tr>
                <td><input type="checkbox"/></td>
                <td>全选</td>
                <td colspan="2"><input type="button" value="播放选中的歌曲" /></td>
                <td>播放</td>
                <td>歌词</td>
                <td>下载</td>
            </tr>
            <tr ng-repeat="s in sings">
                <td><input type="checkbox"/></td>
                <td>{{$index+1}}</td>
                <td>{{s.sname}}</td>
                <td>{{s.author}}</td>
                <td><a href={{s.spath}}>播放</a></td>
                <td>歌词</td>
                <td>下载</td>
            </tr>
        </table>
        <div ng-view>
            
        </div>
    </body>
    
</html>

原创粉丝点击