Skip to content

Instantly share code, notes, and snippets.

@zhangskills
Created January 7, 2015 10:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zhangskills/c4147deb777ef23159f1 to your computer and use it in GitHub Desktop.
Save zhangskills/c4147deb777ef23159f1 to your computer and use it in GitHub Desktop.
angularjs
@zhangskills
Copy link
Author

基本index.html结构

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <base href="/">
    <title>app</title>
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.min.css">
</head>
<body ng-app="my-app">

    <div ui-view></div>

    <script src="http://cdn.bootcss.com/angular.js/1.3.8/angular.min.js"></script>
    <script src="http://cdn.bootcss.com/angular-ui-router/0.2.13/angular-ui-router.min.js"></script>
    <script src="http://cdn.bootcss.com/angular.js/1.3.8/angular-resource.min.js"></script>
    <script src="http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js"></script>
    <script src="http://cdn.bootcss.com/restangular/1.4.0/restangular.min.js"></script>
    <script src="http://cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
    <script src="http://cdn.bootcss.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

    <script src="/public/app/index.js"></script>
</body>
</html>

@zhangskills
Copy link
Author

基本index.js结构

angular.module('my-app', ['ui.router','restangular'])

.config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
    function($stateProvider, $urlRouterProvider, $locationProvider) {

        $urlRouterProvider.otherwise('/');

        $stateProvider.state('index', {
            url: '/',
            templateUrl: 'public/app/index.html'
        }).state('blog', {
            abstract: true,
            url: '/blog',
            templateUrl: 'public/app/blog/index.html'
        }).state('blog.list', {
            url: '/list',
            templateUrl: 'public/app/blog/list.html',
            controller: 'blogListController'
        }).state('blog.show', {
            url: '/:id',
            templateUrl: 'public/app/blog/show.html',
            controller: 'blogShowController'
        });

        $locationProvider.html5Mode(true);

    }
])

.controller('blogListController', function($scope,Restangular) {
    Restangular.all('api/blog/list').getList().then(function(list){
        $scope.list = list;
    });
})

.controller('blogShowController', function($scope, $stateParams) {
    $scope.id = $stateParams.id;
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment