이 글에서는 주로 AngularJSroutingUi-router 모듈의 사용법을 소개하고, Ui-router 모듈의 기능, 사용법 및 관련 Notes를 예제 형식으로 분석합니다. 도움이 필요한 친구들은 예제를 참고할 수 있습니다. in this article
AngularJS 라우팅 Ui-router 모듈의 사용법을 설명합니다. 다음과 같이 참조할 수 있도록 모든 사람과 공유하십시오.
일부 설계상의 이유로 AngularJS의 기본 라우팅 모듈에는 뷰 중첩을 지원하지 않는 등 몇 가지 단점이 있습니다. 따라서 많은 커뮤니티에서 자체 라우팅 모듈을 설계하기 시작했습니다. 그 중 가장 대표적인 것이 가장 중요한 것이 ui-route이다.
ui-route는 기본 ng-route 모듈의 다른 기능을 향상시키는 강력한 라우팅 모듈입니다.
이제 ui-route에 접근하기 위한 몇 가지 데모 만들기를 시작하세요.
<!--初始页面--> <!doctype html> <meta charset="UTF-8"> <html> <head> <link href="self.css" rel="external nofollow" rel="stylesheet"> </head> <body > <p ng-app="myApp"> <p><a ui-sref = "index">首页</a></p> <p ui-view></p><!--这里是路由视图存放的地方--> </p> <script src="angular.min.js"></script> <script src="angular-ui-router.js"></script> <script src="test2.js"></script> </body> </html>
var app = angular.module('myApp',['ui.router']); app.config(["$stateProvider",function($stateProvider){ $stateProvider .state("index",{ url:'/', template:'<p>我是首页内容</p>' }) }]);
url속성
은 경로의 후속 주소를 고유하게 식별하여 후속 경로와 구별할 수 있습니다.위 내용은 AngularJS에서 라우팅 Ui 라우터 모듈을 사용하기 위한 샘플 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!