1. 말도 안됩니다
이름 : 【Douban Search】
최근 Douban의 API에주의를 기울여 Douban의 오픈 플랫폼이 API 문서 작성을 강화해야한다는 것을 알았습니다. 그러나 Douban V2 Interface가 검색 인터페이스를 제공한다는 만족스러운 발견이 있습니다. 나는 최근에 크롤러를 만들기 위해 팬텀을 사용해 왔습니다. 그것에 대해 생각하면 너무 아름답습니다! Douban 인터페이스가 있으며 데이터를 크롤링하거나 데이터를 저장할 필요가 없습니다. 나는 그것을 Github 페이지에 던져 직접 수행합니다. 더반, 좋아요! 나는 또한 최근에 Angular를보고 있었기 때문에 Angular + Douban API를 사용하여 웹 앱을 만들기 시작했습니다. 그래서 ... 온라인으로 집에 던져졌습니다.
경험 주소 : http://vczero.github.io/t/html/index.html#/
프로젝트 주소 : https://github.com/vczero/search (모두가 포크에 오신 것을 환영합니다.
2. 사진을 직접 업로드하십시오
(1) 서적 검색
(2) 음악 검색 인터페이스
(3) 예약 세부 사항
(4) 영화 검색
III. 프로젝트 구조 및 소개
3.주의를 기울여야 할 몇 가지 포인트
(1) -webkit-tap-Highlight-Color : RGBA (255,255,255,0); 클릭하면 하이라이트 그림자를 제거하십시오
(2) 박스 크기 : 패딩이 포함 된 테두리 박스 사용, 픽셀 계산
(3) 위치 고정 및 검색 점프의 조합 (가상 키보드로 인한)
(4) Angular-UI-Router의 다중 뷰 제어
(5) iOS 및 Android 시스템의 다양한 세부 사항
(6) AngularJS 코드 종속성 주입 압축 문제
...
서비스 및 상태 라우팅 코드가 게시되었다고 생각합니다.
코드 사본은 다음과 같습니다.
/*서비스 URL 구성*/
app.constant ( 'serviceconfig', {
Book_Search : 'https://api.douban.com/v2/book/search',
book_search_id : 'https://api.douban.com/v2/book/',
music_search : 'https://api.douban.com/v2/music/search',
music_search_id : 'https://api.douban.com/v2/music/',
movie_search : 'https://api.douban.com/v2/movie/search',
movie_search_id : 'https://api.douban.com/v2/movie/subject/'
});
app.config ([ '$ stateprovider', '$ urlrouterprovider', function ($ stateprovider, $ urlrouterprovider) {
/*URL 라우팅*/
$ urlrouterProvider.otherwise ( "/");
/*상태 구성*/
$ StateProvider
// 첫 페이지
.STATE ( 'index', {
URL : '/',
보기 : {
헤더 : {
TemplateUrl : '../html/views/list_header.html',
컨트롤러 : 'SearchController'
},
컨테이너:{
templateUrl : '../html/views/list_book.html',
컨트롤러 : 'BookListController'
},
보행인:{
TemplateUrl : '../html/views/list_footer.html',
컨트롤러 : ''
}
}
})
// 도서 목록
.state ( 'book_list', {
URL : '/book',
보기 : {
헤더 : {
TemplateUrl : '../html/views/list_header.html',
컨트롤러 : 'SearchController'
},
컨테이너:{
templateUrl : '../html/views/list_book.html',
컨트롤러 : 'BookListController'
},
보행인:{
TemplateUrl : '../html/views/list_footer.html',
컨트롤러 : ''
}
}
})
// 예약 세부 사항
.state ( 'book_detail', {
URL : '/book/: id',
보기 : {
헤더 : {
TemplateUrl : '../html/views/list_header.html',
컨트롤러 : 'SearchController'
},
컨테이너:{
TemplateUrl : '../html/views/detail_book.html',
컨트롤러 : 'BookDetailController'
},
보행인:{
TemplateUrl : '../html/views/list_footer.html',
컨트롤러 : ''
}
}
})
// 음악 목록
.state ( 'music_lsit', {
URL : '/music',
보기 : {
헤더 : {
TemplateUrl : '../html/views/list_header.html',
컨트롤러 : 'SearchController'
},
컨테이너:{
TemplateUrl : '../html/views/list_music.html',
컨트롤러 : 'MusicListController'
},
보행인:{
TemplateUrl : '../html/views/list_footer.html',
컨트롤러 : ''
}
}
})
// 영화 목록
.state ( 'movie_lsit', {
URL : '/movie',
보기 : {
헤더 : {
TemplateUrl : '../html/views/list_header.html',
컨트롤러 : 'SearchController'
},
컨테이너:{
TemplateUrl : '../html/views/list_movie.html',
컨트롤러 : 'MovielistController'
},
보행인:{
TemplateUrl : '../html/views/list_footer.html',
컨트롤러 : ''
}
}
})
.STATE ( 'search', {
URL : '/search/: type',
보기 : {
헤더 : {
TemplateUrl : '../html/views/search.html',
컨트롤러 : '검색'
},
컨테이너:{
templateurl : '',
컨트롤러 : ''
},
보행인:{
templateurl : '',
컨트롤러 : ''
}
}
});
}]);