Angularui 다운로드 주소 : https://github.com/clouda-team/blendui
다운로드 및 압축 압축 후 Demo는 루트 디렉토리에 있습니다.
이제 공식 웹 사이트에서 데모 사용을 테스트하십시오.
브라우저를 사용하여 모바일 앵글 -UI-Master/Demo/Index.html을 열고로드 스타일이나 JS가 없음을 알 수 있습니다. 그런 다음 요소를 검토 한 후 로딩 경로가 잘못되었다는 것을 알았으므로 다음과 같은 수정을했습니다.
5 행 : <베이스 href = "/mobile-angular-ui-master/"/>
모든/사이트 루 디렉토리 경로를 제거하고 상대 경로로 변경
demo.js 및 demo.css는 데모 디렉토리에 있습니다 <script src = "demo/demo.js"> </script>, <link rel = "stylesheet"href = "demo/demo.css"/>
30,34 행 : <div ng-include = " 'demo/sidebar.html'", <div ng-include = " 'demo/sidebarright.html'"
수정 된 index.html
코드 사본은 다음과 같습니다.
<! doctype html>
<html>
<헤드>
<meta charset = "utf-8" />
<base href = "/mobile-angular-ui-master/"/>
<title> 모바일 각도 UI 데모 </title>
<meta http-equiv = "x-ua-cattible"content = "ie = edge, chrome = 1" />
<meta name = "Apple-Mobile-Web-Appable"컨텐츠 = "예" />
<meta name = "viewport"content = "user-scalable = no, 초기 스케일 = 1.0, 최대 규모 = 1.0, 최소 UI" />
<meta name = "Apple-Mobile-Web-App-status-bar 스타일"컨텐츠 = "예" />
<link rel = "바로 가기 아이콘"href = "favicon.png"type = "image /x-icon" />
<link rel = "스타일 시트"href = "dist/css/mobile-angular-ui-hover.css"/>
<link rel = "스타일 시트"href = "dist/css/mobile-angular-ui-base.css"/>
<link rel = "스타일 시트"href = "dist/css/mobile-angular-ui-desktop.css"/>
<link rel = "Stylesheet"href = "demo /demo.css" />
<script src = "// cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular.min.js"> </script>
<script src = "// cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular-route.min.js"> </script>
<script src = "// cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular-touch.min.js"> </script>
<스크립트 src = "dist/js/mobile-angular-ui.js"> </script>
<script src = "demo/demo.js"> </script>
</head>
<바디
ng-app = "mobileangularuiexamples"
ng-controller = "MainController"
>
<!-사이드 바->
<div ng-include = " 'demo/sidebar.html'"
UI-track-as-search-param = 'true'
>/div>
<div ng-include = " 'demo/sidebarright.html'"
>/div>
<div>
<!-navbars->
<div>
<div ui-yield-to = "title">
모바일 각도 UI
</div>
<div>
<div ui-toggle = "sidebarleft">
<i> </i> 메뉴
</div>
</div>
<div ui-yield-to = "navbaraction">
<div ui-toggle = "Sidebarright">
<i> </i> 채팅
</div>
</div>
</div>
<div>
<div>
<a href = "http://mobileangularui.com/"> <i> </i> docs </a>
<a href = "https://github.com/mcasimir/mobile-angular-ui"> <i> </i> 소스 </a>
<a href = "https://github.com/mcasimir/mobile-angular-ui/issues"> <i> </i> 문제 </a>
</div>
</div>
<!-앱 바디->
<div ng-class = "{로드 :로드}">
<div ng-show = "로드">
<i> </i>
</div>
<div>
<ng-view> </ng-view>
</div>
</div>
</div> <!-~ .app->
<div ui-yield-to = "modals"> </div>
<cript>
(함수 (i, s, o, g, r, a, m) {i [ 'googleanalyticsobject'] = r; i [r] = i [r] || function () {
(i [r] .q = i [r] .q || []). push (arguments)}, i [r] .l = 1*new date (); a = s.createelement (o),
m = s.getEmentsByTagName (O) [0]; A.Async = 1; a.src = g; m.parentNode.insertbefore (a, m)
}) (창, 문서, '스크립트', '// www.google-analytics.com/analytics.js' ,'ga');
GA ( 'Create', 'UA-48036416-1', 'mobileangularui.com');
ga ( 'send', 'pageview');
</스크립트>
</body>
</html>
현재 문제는 여전히 존재하며 HOME.HTML이 성공적으로로드되지 않았다는 것을 알았습니다.
http://gdzx.com/mobile-angular-ui-master/home.hmll, 디렉토리는 데모에 있어야합니다. 소스 코드를 확인할 때 HOME.HTML이 어디에서 소개되었는지 찾을 수 없습니다. 나는 그것이 각도로 적재 된 것 같아요. Angularui를 배울 때이 문제를 해결하겠습니다.
오늘 (2014/12/20)이 마침내 완료되었습니다. 전체 프로젝트를 웹 사이트 루트 디렉토리에 넣은 다음 Demo/Index.html을 방문하여 모든 CSS 스타일과 JS 스크립트를 정상적으로로드하십시오.