angularjs 创建SPA 方法

没怎么用过 angularjs ,  不太熟。有时间的去学习下。

angularjs 创建 SPA App 应用时 ,支持使用  MVC  结构 和 依赖注入。

假设APP 名字叫 blogApp, 那么 app.js 中可以这样快速定义。

var app = angular
    .module('youAppName', ['ngRoute']) // 定义模块名称和需要的内置模块
    .config(['$routeProvider', function ($routeProvider) { // 定义URL路由
        $routeProvider
            .when('/', { templateUrl: 'app/views/index.html' })
            .when('/join/:id', {
                templateUrl: 'app/views/join.html'
            })
            .when('/play/:id', {
                templateUrl: 'app/views/play.html'
            })
            .otherwise({
                redirectTo: '/'
            });
    }])
    .run(['$rootScope', "$log", function ($rootScope, $log) {
        // todo ...
    }])
    .factory('MathService', ['$http', function ($http) {
        var factory = {};

        factory.multiply = function (a, b) {
            return a * b;
        }


        return factory;
    }])
    .service('CalcService', function (MathService) {
        this.square = function (a) {
            return MathService.multiply(a, a);
        }
    });;

// 各个子页面的controller。 可以放到对于的视图文件夹中
angular.module('youAppName').controller('youController1', ["$scope", "$rootScope", "$location", "$http",
    function ($scope, $rootScope, $location, $http) {
        // todo ...
    }]);
angular.module('youAppName').controller('youController2', ["$scope", "$rootScope", "$location", "$http",
    function ($scope, $rootScope, $location, $http) {
        // todo ...
    }]);

 

已禁用评论。