前端开发者| 优达学城前端开发视频 |
| web前端开发html教学视频 |
| 清华创客前端开发视频 |
html 代码
<!DOCTYPE html>
<html lang=”en” ng-app=”myApp”>
<head>
<meta charset=”UTF-8″ />
<title>Title</title>
<link
rel=”stylesheet”
/>
<style>
.orderColor {
color: red;
}
</style>
</head>
<body ng-controller=”myProduct”>
<div class=”container”>
<nav class=”navbar navbar-default” role=”navigation”>
<div class=”container-fluid”>
<div
class=”collapse navbar-collapse”
id=”bs-example-navbar-collapse-1″
>
<form class=”navbar-form navbar-left” role=”search”>
<div class=”form-group”>
<input
type=”text”
class=”form-control”
placeholder=”Search”
ng-model=”search”
/>
</div>
</form>
</div>
</div>
</nav>
<table class=”table”>
<thead>
<tr>
<th
ng-click=”changeOrder(‘id’)”
ng-class=”{dropup:order==”&&orderType==’id’}”
>
产品编号
<div
ng-class=”{orderColor:orderType==’id’}”
class=”caret”
></div>
</th>
<th
ng-click=”changeOrder(‘name’)”
ng-class=”{dropup:order==”&&orderType==’name’}”
>
产品名称
<div
ng-class=”{orderColor:orderType==’name’}”
class=”caret”
></div>
</th>
<th
ng-click=”changeOrder(‘price’)”
ng-class=”{dropup:order==”&&orderType==’price’}”
>
产品价格
<div
ng-class=”{orderColor:orderType==’price’}”
class=”caret”
></div>
</th>
</tr>
</thead>
<tbody>
<tr
ng-repeat=”item in product|filter:search|orderBy:order+orderType”
>
<td>{{ item.id }}</td>
<td>{{ item.name }}</td>
<td>{{ item.price | currency: ‘(RMB)’ }}</td>
</tr>
</tbody>
</table>
</div>
<script>
var mod = angular.module(‘myApp’, [])
mod.controller(‘myProduct’, [
‘$scope’,
function($scope) {
$scope.orderType = ‘id’
$scope.order = ‘-‘
$scope.changeOrder = function(type) {
$scope.orderType = type
if ($scope.order == ”) {
$scope.order = ‘-‘
} else {
$scope.order = ”
}
}
$scope.product = [
{
id: 3,
name: ‘iphone6’,
price: 5000,
},
{
id: 4,
name: ‘imac’,
price: 8000,
},
{
id: 1,
name: ‘iphone6plus’,
price: 6000,
},
{
id: 5,
name: ‘nokia’,
price: 3000,
},
{
id: 2,
name: ‘ipad’,
price: 2000,
},
]
},
])
</script>
</body>
</html>
| 前端开发的课程视频 |
| 前端开发里面怎么上传视频 |
| 2016达内前端开发视频微盘 |
970106_lzh 2年前 (2021-01-08)说：
huihui 3年前 (2020-10-20)说：
Satisfy 3年前 (2020-06-05)说：
评论前必须登录！
注册