本文共 1896 字，大约阅读时间需要 6 分钟。

一切从模块化开始

// angular.module(name, [requires], [configFn]);// name：字符串类型，代表模块的名称；// requires：字符串的数组，代表该模块依赖的其他模块列表，如果不依赖其他模块，用空数组即可；var app = angular.module('app', ["ui.router"]);// 路由：https://ui-router.github.io/ng1/docs/0.3.1/index.html#/api/ui.routerapp.config(['$stateProvider','$urlRouterProvider', function($stateProvider,$urlRouterProvider){
      $stateProvider.state(stateName, stateConfig); //配置路由   //stateConfig默认包含的字段: template, templateUrl, templateProvider, controller, controllerProvider, resolve, url, params, views, abstract, onEnter, onExit, reloadOnSearch, data   $stateProvider.state('userInfo',{});         //配置路由   $urlRouterProvider.otherwise(defaultPath);    //默认的路由   $urlRouterProvider.otherwise('/home.html');})$state.go('userInfo');

angular.bootstrap —–此方法用于手动加载angularjs模板

angular.bootstrap(element, [modules], [config]);ng-app='main';// 等同于angular.bootstrap(document, ['main'])

data-ui-view 根据路由指定的url填充页面

监听页面加载完毕

// 在controller里面利用on或者watch$scope.$on('$viewContentLoaded', function () {
        Metronic.initComponents();});

localStorage 本地存储

localStorage.setItem("MenuTree", angular.toJson(data));localStorage.setItem("userInfo", angular.toJson($scope.userInfo));localStorage.getItem("userInfo")

Angular的事件机制—$rootScope.$broadcast

app.controller('SomeCtrl', ['$rootScope', function($rootScope) {
       $rootScope.$broadcast("rootEvent", 'Data to Send');    // $rootScope也可以通过$on订阅从$rootScope.$broadcast发布的事件    $rootScope.$on("rootEvent", function(event, 'Data to Send') {
           // balabala    });}])// 所有$scope都能够通过$on订阅从$rootScope.$broadcast发布的事件.controller('ParentCtrl', ['$scope', function($scope) {
       $scope.$on("rootEvent", function(event, 'Data to Send') {
           // balabala    });}]).controller('SiblingOneCtrl', ['$scope', function($scope) {
       $scope.$on("rootEvent", function(event, 'Data to Send') {
           // balabala    });}])

转载地址：https://blog.csdn.net/snow51/article/details/81082739 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！