나는 요즘 Angularjs와 Backbone을 보았고, Knockout와 Emberjs에 대해 배웠습니다. 방금 인터넷에서 각도 라우터의 데모를 보았습니다. 이제 나는 그것을 기록 할 것입니다.
코드 사본은 다음과 같습니다.
<! ----
demo_index.html
->
<! doctype html>
<헤드>
<meta charset = "utf-8">
<title> 경로 </title>
</head> <br> //이 중요한 것은 IE와 호환되는 것입니다. 그것이 작동하지 않는다면, 즉 당신을 속이는 것, 당신은 알고 있습니다.
<body ng-app = "RouteApp"id = "RouteApp">
<H1> Route Demo Index </h1>
<script src = "http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2pre/html5shiv.js"> </script>
<script src = "http://cdnjs.cloudflare.com/ajax/libs/json2/20121008/json2.js"> </script>
<div ng-view> </div>
<script src = "http : // localhost : 81/js/angular.min.js"> </script>
<cript>
var roundeapp = angular.module ( 'louteapp', []);
lourteApp.config ([ '$ loureprovider', function ($ loureprovider) {
$ loureprovider
. 언제 ( '/list', {
templateUrl : 'list.html',
컨트롤러 : 'lourtelistctl'
})
. 시절 ( '/list/: id', {
templateUrl : 'detail.html',
컨트롤러 : 'lourdeteTailctl'
})
.그렇지 않으면({
리디렉션 : '/list'
});
}]);
//제어 장치
lourdeApp.controller ( 'lourtelistctl', function ($ scope) {
});
RouteApp.controller ( 'lourdedetailctl', function ($ scope, $ loureparams) {
$ scope.id = $ loureparams.id;
});
</스크립트>
</body>
</html>
//list.html
다음 코드를 실행하십시오
코드 사본은 다음과 같습니다.
<hr/>
<h3> 경로 : list.html </h3>
<ul>
<li ng-repeat = "id in [1, 2, 3]">
<a href = "#/list/{{id}}"> id {{id}} </a>
</li>
</ul>
//detail.html
다음 코드를 실행하십시오
코드 사본은 다음과 같습니다.
<hr/>
<h3> Route <span style = "color : red;"> {{id}} </span> : detail.html </h3>
그것이 모든 코드입니다. 당신이 그것을 좋아할 수 있기를 바랍니다.