web App_node.js wurde basierend auf der Douban API Angular entwickelt

1. Unsinn reden

Name:【Douban-Suche】

Ich habe mich kürzlich mit der API von Douban befasst und festgestellt, dass die offene Plattform von Douban das Schreiben von API-Dokumenten verbessern muss. Es gibt jedoch eine erfreuliche Entdeckung, dass die Schnittstelle von Douban V2 eine Suchschnittstelle bietet. Kürzlich habe ich Phantom verwendet, um einige Reptilien herzustellen, und wenn ich darüber nachdenke, sind sie so schön! Es gibt eine Schnittstelle auf Douban, sodass ich die Daten nicht crawlen oder speichern muss, sondern sie einfach der Github-Seite überlassen und die Arbeit direkt beenden kann. Douban, schön! Ich habe kürzlich auch Angular gelesen und kam auf die Idee, die Angular Douban API zu verwenden, um eine Web-App zu erstellen. Es war also mühsam, online nach Hause zu gehen.

Erfahrungsadresse: http://vczero.github.io/t/html/index.html#/

Projektadresse: https://github.com/vczero/search (Jeder ist herzlich eingeladen, nach Belieben zu forken, zu modifizieren und weiterhin Funktionen hinzuzufügen; Sie sind herzlich eingeladen, Bausteine ​​herzustellen und gemeinsam Fortschritte zu machen.)

2. Laden Sie das Bild direkt hoch

(1) Buchsuche

(2) Musiksuchoberfläche

(3) Buchdetails

(4) Filmsuche

3. Projektstruktur und Einführung

3. Mehrere Punkte, die Sie beachten sollten

(1)-webkit-tap-highlight-color:rgba(255,255,255,0); Hervorhebungsschatten entfernen, wenn darauf geklickt wird

(2) Box-Größe: Verwendung von Border-Box, einschließlich Pixelberechnung der Polsterung

(3) Kombination aus Positionsfixierung und Suchsprung (verursacht durch virtuelle Tastatur)

(4) Multi-View-Steuerung des Angular-UI-Routers

(5) Verschiedene Details zum iOS- und Android-System

(6) Probleme beim Komprimieren der AngularJS-Code-Abhängigkeitsinjektion

...

Ich werde die Codes für Dienste und Staatsrouting veröffentlichen, die ich für wichtiger halte

Code kopieren Der Code lautet wie folgt:

/*服务的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: '/',
            Ansichten:{
                Kopfzeile:{
                    templateUrl: '../html/views/list_header.html',
                    Controller: 'SearchController'
                },
                Container:{
                    templateUrl: '../html/views/list_book.html',
                    Controller: 'BookListController'
                },
                Fußzeile:{
                    templateUrl: '../html/views/list_footer.html',
                    Controller: ''
                }
            }
        })
        //Buchliste
        .state('book_list',{
            URL: '/book',
            Ansichten:{
                Kopfzeile:{
                    templateUrl: '../html/views/list_header.html',
                    Controller: 'SearchController'
                },
                Container:{
                    templateUrl: '../html/views/list_book.html',
                    Controller: 'BookListController'
                },
                Fußzeile:{
                    templateUrl: '../html/views/list_footer.html',
                    Controller: ''
                }
            }
        })
        // Buchdetails
        .state('book_detail',{
            URL: '/book/:id',
            Ansichten:{
                Kopfzeile:{
                    templateUrl: '../html/views/list_header.html',
                    Controller: 'SearchController'
                },
                Container:{
                    templateUrl: '../html/views/detail_book.html',
                    Controller: 'BookDetailController'
                },
                Fußzeile:{
                    templateUrl: '../html/views/list_footer.html',
                    Controller: ''
                }
            }
        })
        // Musikliste
        .state('music_lsit',{
            URL: '/music',
            Ansichten:{
                Kopfzeile:{
                    templateUrl: '../html/views/list_header.html',
                    Controller: 'SearchController'
                },
                Container:{
                    templateUrl: '../html/views/list_music.html',
                    Controller: 'musicListController'
                },
                Fußzeile:{
                    templateUrl: '../html/views/list_footer.html',
                    Controller: ''
                }
            }
        })
        // Filmliste
        .state('movie_lsit',{
            URL: '/movie',
            Ansichten:{
                Kopfzeile:{
                    templateUrl: '../html/views/list_header.html',
                    Controller: 'SearchController'
                },
                Container:{
                    templateUrl: '../html/views/list_movie.html',
                    Controller: 'movieListController'
                },
                Fußzeile:{
                    templateUrl: '../html/views/list_footer.html',
                    Controller: ''
                }
            }
        })
        .state('search',{
            URL: '/search/:type',
            Ansichten:{
                Kopfzeile:{
                    templateUrl: '../html/views/search.html',
                    Controller: 'Suchen'
                },
                Container:{
                    templateUrl: '',
                    Controller: ''
                },
                Fußzeile:{
                    templateUrl: '',
                    Controller: ''
                }
            }
        });
}]);