Javascript 角js引导模式问题
我有一个angularjs应用程序html页面，如下所示：Javascript 角js引导模式问题,javascript,jquery,angularjs,twitter-bootstrap,Javascript,Jquery,Angularjs,Twitter Bootstrap,我有一个angularjs应用程序html页面，如下所示： <!DOCTYPE html> <html ng-app="StudentProgram"> <head> <title>Student Program Management</title> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angul
<!DOCTYPE html>
<html ng-app="StudentProgram">
<head>
<title>Student Program Management</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js"></script>
<script data-require="angular-ui-bootstrap@*" data-semver="0.10.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.min.js"></script>
<link type="text/css" rel="stylesheet" href="css/bootstrap.css"/>
<link type="text/css" rel="stylesheet" href="css/badge.css"/>
<link href="css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/ng-template" id="myModalContent.html">
<h1 ng-bind="subcategory.name2"></h1>
<ul>
<li ng-repeat="child in subcategory.children" ng-bind="child"></li>
</ul>
</script>
</head>
<body>
<div class="container">
<div class="col-lg-9 col-md-9 col-sm-10">
<div class="" id="content">
<div class="pull-right">
<span class="glyphicon glyphicon-plus-sign"></span>
<span class="glyphicon glyphicon-file"></span>
<span class="glyphicon glyphicon-calendar"></span>
<span class="glyphicon glyphicon-search"></span>
</div>
<br/><br/>
<div ng-controller="mycontroller">
<div ng-repeat="detail in details">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><span class="badge badge-machb pull-right">{{detail.completed}} / {{detail.required}}</span>{{detail.name1}}</h3>
</div>
<div ng-repeat="subcategory in detail.subcategory1" class="panel-body">
<h4><strong>{{subcategory.name2}}
<button class="btn btn-default pull-right" ng-click="open($index)">Add Course <span class="glyphicon glyphicon-plus"></span></button>
</strong></h4>
<table class="table table-hover">
<tr>
<th>Course</th>
<th>Term</th>
<th>Credit</th>
<th>Grade</th>
</tr>
<tr ng-repeat="subcategory2 in subcategory.subcategory2">
<td>{{subcategory2.course}}</td>
<td>{{subcategory2.term}}</td>
<td>{{subcategory2.credit}}</td>
<td>{{subcategory2.grade}}</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/bootstrap.js"></script>
<script>
var app = angular.module('StudentProgram', ['ui.bootstrap']);
app.controller('mycontroller', function($scope, $modal, $log){
$scope.details=[
{name1:"TIER 1 - CORE FOUNDATIONS", completed:"9", required:"13", subcategory1:[
{name2:"Critical Reading and Writing",completed2:"6",required2:"6",planned2:"6",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','CZEC-1311','CZEC-1312',
'FREN-1311','FREN-1312','FREN-1411','GERM-1311','GERM-1312',
'GERM-1411','GREE-1412','ITAL-1412','JAPN-1412','KORE-1412',
'LATI-1412','PORT-1412','RUSS-1412','SGNL-1301','SGNL-1302',
'SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
{course:"HIST 1301",term:"Spring 2012",credit:"3.0",grade:"B"},
{course:"ENGL 1301",term:"Spring 2012",credit:"3.0",grade:"A"}
]},
{name2:"Speaking and Listening",completed2:"4",required2:"4",planned2:"4",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','CZEC-1311','CZEC-1312',
'FREN-1311','FREN-1312','FREN-1411','GERM-1311','GERM-1312',
'GERM-1411','GREE-1412','ITAL-1412','JAPN-1412','KORE-1412',
'LATI-1412','PORT-1412'], subcategory2:[
{course:"SPCH 1311",term:"Spring 2012",credit:"4.0",grade:"A"}
]},
{name2:"Quantitative Reasoning",completed2:"0",required2:"4",planned2:"0",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
]},
{name2:"Wellness and The Human Experience",completed2:"0",required2:"3",planned2:"0",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
]}
]},
{name1:"TIER 2 - CORE DOMAINS", completed:"10", required:"26", subcategory1:[
{name2:"Qualitative Reasoning, Literacy and Research",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
{course:"ENGL 1302",term:"Summer 2012",credit:"3.0",grade:"A"}
]},
{name2:"Self and Society",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','CZEC-1311','CZEC-1312',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
{course:"GOVT 2301",term:"Spring 2012",credit:"3.0",grade:"B"},
{course:"PSYC 2301",term:"Summer 2012",credit:"--",grade:"--"}
]},
{name2:"Qualitative Reasoning, Literacy and Research",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
]},
{name2:"Qualitative Reasoning, Literacy and Research",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'GERM-1411','GREE-1412','ITAL-1412','JAPN-1412','KORE-1412',
'LATI-1412','PORT-1412','RUSS-1412','SGNL-1301','SGNL-1302',
'SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
{course:"BIOL 1406",term:"Spring 2012",credit:"4.0",grade:"B"},
{course:"BIOL 1407",term:"Summer 2012",credit:"--",grade:"--"}
]}
]},
{name1:"TIER 3 - INTEGRATIVE LEARNING", completed:"0", required:"3",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','CZEC-1311','CZEC-1312',
'SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory1:[
{name2:"", subcategory2:[
]}
]},
{name1:"AS. SCIENCE GENERAL ELECTIVES", completed:"13", required:"18", subcategory1:[
{name2:"",children:['SPCH-1311','SPCH-1315','SPCH-1321','ARAB-1311','ARAB-1312',
'CHIN-1312','CHIN-1411','CHIN-1412','CZEC-1311','CZEC-1312',
'FREN-1311','JAPN-1412','KORE-1412','LATI-1412','PORT-1412',
'RUSS-1412','SGNL-1301','SGNL-1302',
'SPAN-1311','SPAN-1312','SPAN-1411','SPAN-1412','VIET-1311',
'VIET-1312','VIET-1411','VIET-1412'], subcategory2:[
{course:"ECON 2302",term:"Spring 2012",credit:"3.0",grade:"A"},
{course:"COSC 1300",term:"Summer 2012",credit:"3.0",grade:"B"},
{course:"HDEV 1300",term:"Summer 2012",credit:"3.0",grade:"A"},
{course:"CHEM 1405",term:"Summer 2012",credit:"4.0",grade:"C"},
{course:"BIOL 2401",term:"Summer 2012",credit:"--",grade:"--"}
]}
]}
];
$scope.open = function ($index) {
var modalInstance = $modal.open({
templateUrl: 'myModalContent.html',
controller: ModalInstanceCtrl,
resolve: {
detail: function() {
return $scope.details[0].subcategory1[$index];
}
}
});
};
});
var ModalInstanceCtrl = function ($scope, $modalInstance, detail) {
$scope.subcategory = detail;
};
</script>
<br/>
</div>
</body>
</html>
学生计划管理
{{detail.completed}/{{detail.required}{{detail.name1}
{{subcategory.name2}
添加课程
课程
学期
信用
等级
{{子类别2.课程}
{{subcategory 2.term}
{{subcategory 2.credit}
{{subcategory 2.grade}
var app=angular.module（'StudentProgram'，['ui.bootstrap']）；
app.controller（'mycontroller'，函数（$scope、$modal、$log）{
$scope.details=[
{name1:“一级-核心基础”，填写：“9”，要求：“13”，子类别1：[
{name2:“批判性阅读和写作”，完成2:“6”，要求2:“6”，计划2:“6”，儿童：['SPCH-1311'，'SPCH-1315'，'SPCH-1321'，'ARAB-1311'，'ARAB-1312'，
‘CHIN-1312’、‘CHIN-1411’、‘CHIN-1412’、‘CZEC-1311’、‘CZEC-1312’，
“FREN-1311”、“FREN-1312”、“FREN-1411”、“GERM-1311”、“GERM-1312”，
‘GERM-1411’、‘GREE-1412’、‘ITAL-1412’、‘JAPN-1412’、‘KORE-1412’，
‘LATI-1412’、‘PORT-1412’、‘RUSS-1412’、‘SGNL-1301’、‘SGNL-1302’，
‘SPAN-1311’、‘SPAN-1312’、‘SPAN-1411’、‘SPAN-1412’、‘越南1311’，
“越南-1312”、“越南-1411”、“越南-1412]”，子类别2：[
{课程：“历史1301”，学期：“2012年春季”，学分：“3.0”，成绩：“B”}，
{课程：“英语1301”，学期：“2012年春季”，学分：“3.0”，成绩：“A”}
]},
{姓名2:“说和听”，完成2:“4”，要求2:“4”，计划2:“4”，儿童：['SPCH-1311'，'SPCH-1315'，'SPCH-1321'，'ARAB-1311'，'ARAB-1312'，
‘CHIN-1312’、‘CHIN-1411’、‘CHIN-1412’、‘CZEC-1311’、‘CZEC-1312’，
“FREN-1311”、“FREN-1312”、“FREN-1411”、“GERM-1311”、“GERM-1312”，
‘GERM-1411’、‘GREE-1412’、‘ITAL-1412’、‘JAPN-1412’、‘KORE-1412’，
“LATI-1412”，“PORT-1412]”，子类别2：[
{课程：“SPCH 1311”，学期：“2012年春季”，学分：“4.0”，成绩：“A”}
]},
{name2:“定量推理”，完成2:“0”，要求2:“4”，计划2:“0”，儿童：['SPCH-1311'，'SPCH-1315'，'SPCH-1321'，'ARAB-1311'，'ARAB-1312'，
‘CHIN-1312’、‘CHIN-1411’、‘CHIN-1412’、‘SPAN-1311’、‘SPAN-1312’、‘SPAN-1411’、‘SPAN-1412’、‘越南-1311’，
“越南-1312”、“越南-1411”、“越南-1412]”，子类别2：[
]},
{name2:“健康与人类体验”，完成2:“0”，要求2:“3”，计划2:“0”，儿童：['SPCH-1311'，'SPCH-1315'，'SPCH-1321'，'ARAB-1311'，'ARAB-1312'，
‘CHIN-1312’、‘CHIN-1411’、‘CHIN-1412’、‘SPAN-1311’、‘SPAN-1312’、‘SPAN-1411’、‘SPAN-1412’、‘越南-1311’，
“越南-1312”、“越南-1411”、“越南-1412]”，子类别2：[
]}
]},
{name1:“第2层-核心域”，填写：“10”，必填：“26”，子类别1：[
{name2:“定性推理、识字和研究”，儿童：['SPCH-1311'、'SPCH-1315'、'SPCH-1321'、'ARAB-1311'、'ARAB-1312'，
‘CHIN-1312’、‘CHIN-1411’、‘CHIN-1412’、‘SPAN-1311’、‘SPAN-1312’、‘SPAN-1411’、‘SPAN-1412’、‘越南-1311’，
“越南-1312”、“越南-1411”、“越南-1412]”，子类别2：[
{课程：“英语1302”，学期：“2012年夏季”，学分：“3.0”，成绩：“A”}
]},
{姓名2：“自我与社会”，儿童：['SPCH-1311'、'SPCH-1315'、'SPCH-1321'、'ARAB-1311'、'ARAB-1312'，
‘CHIN-1312’、‘CHIN-1411’、‘CHIN-1412’、‘CZEC-1311’、‘CZEC-1312’，
“越南-1312”、“越南-1411”、“越南-1412]”，子类别2：[
{课程：“政府2301”，学期：“2012年春季”，学分：“3.0”，成绩：“B”}，
{课程：“心理2301”，学期：“2012年夏季”，学分：“--”，成绩：“--”
]},
{name2:“定性推理、识字和研究”，儿童：['SPCH-1311'、'SPCH-1315'、'SPCH-1321'、'ARAB-1311'、'ARAB-1312'，
‘SPAN-1311’、‘SPAN-1312’、‘SPAN-1411’、‘SPAN-1412’、‘越南1311’，
“越南-1312”、“越南-1411”、“越南-1412]”，子类别2：[
]},
{name2:“定性推理、识字和研究”，儿童：['SPCH-1311'、'SPCH-1315'、'SPCH-1321'、'ARAB-1311'、'ARAB-1312'，
‘GERM-1411’、‘GREE-1412’、‘ITAL-1412’、‘JAPN-1412’、‘KORE-1412’，
‘LATI-1412’、‘PORT-1412’、‘RUSS-1412’、‘SGNL-1301’、‘SGNL-1302’，
‘SPAN-1311’，‘SP
<div ng-repeat="subcategory in detail.subcategory1" class="panel-body">
<h4>
<strong>{{subcategory.name2}}
<button class="btn btn-default pull-right" ng-click="open(subcategory)">