收藏：需加angular.js文件
<html >
<head>
<title></title>
<meta charset="utf-8"/>
<style type="text/css">
input {
font-size:64px;
}
</style>
<script src="angular.js"></script>
</head>
<body ng-app="app.demo">
<div ng-controller="ListCtrl">
<fieldset>
<legend>users</legend>
<ul>
<li ng-repeat="user in users | orderBy: ‘weight‘">
<a href="#" ng-click="show(user.id)" >{{user.name}} {{user.weight}}</a>
</li>
</ul>
</fieldset>
<fieldset>
<legend>user</legend>
<div ng-show="user" >
<h1> {{user.name}} </h1>
<input type="text" ng-model="user.weight" />
</div>
</fieldset>
</div>
<script type="text/javascript">
var myApp = angular.module("app.demo", []);
myApp.factory("Data", function(){
return {users:[
{id:0,name:"第一名",weight:100},
{id:1,name:"第二名",weight:200},
{id:2,name:"第三名",weight:300},
{id:3,name:"第四名",weight:400},
{id:4,name:"第五名",weight:500}
]};
});
myApp.controller("ListCtrl", ["$scope", "Data", function($scope, Data) {
$scope.users = Data.users;
$scope.show = function(id){
$scope.user= Data.users[id];
}
}]);
</script>
</body>
</html>
时间： 2024-10-15 16:55:39