先直接上代码了 T. T结构:
index.html
<!DOCTYPE html>
<html lang="zh-HANS" ng-app="Nexus">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta charset="utf-8">
<script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<title>Nexus</title>
<script src="javascripts/app.js"></script>
<script src="controllers/controller.js"></script>
</head>
<body>
<div ng-view>
</div>
</body>
</html>
app.js
angular.module('Nexus', ["ngRoute"])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'partials/list.html',
controller: 'PhoneListCtrl'
})
.when(('/:phoneId', {
templateUrl: 'partials/phone-detail.html',
controller: 'PhoneDetCtrl'
}))
.otherwise({
redirectTo: '/'
})
}])
controller.js
var Nexus = angular.module('Nexus', []);
Nexus.controller('PhoneListCtrl',
function($scope, $http) {
$scope.list = ["nexux 6P", "nexus 5X"];
});
Nexus.controller('PhoneDetCtrl',
function($scope, $routeParams, $http) {
$http.get('phones/' + $routeParams.phoneId + '.json').success(function(data) {
$scope.phone = data;
})
});
打开后发现页面是空的。求教哪里没写对,谢谢!!
弄了个很渣大demo
,看起来应该会方便 点击这里
没有引入
ngRoute
这个模板的js