search

Home  >  Q&A  >  body text

angular.js - angularjs uses oclazyload to load ui-grid

$ocLazyLoadProvider configuration section

          {
              name: 'ui.grid',
              files: [
                  'vendor/modules/angular-ui-grid/ui-grid.min.css',
                  'vendor/modules/angular-ui-grid/ui-grid.min.js'
              ]
          },

ui-router part


.state('app.account.account_M',{
   url:'/account_M',
                  templateUrl:'tpl/account_account_M.html',
                  resolve: {
                     deps: ['$ocLazyLoad',
                        function( $ocLazyLoad ){
                          return $ocLazyLoad.load(['ui.grid']).then(
                              function(){          
                                  return $ocLazyLoad.load('js/controllers/account_M.js');
                              }
                          );
                      }]
                  }
              })
          

This is no problem, but ui-grid separates many functions. If you want to use them, you need to inject multiple
s from ui-grid.min.js. As a result, I wrote it as follows
$ ocLazyLoadProvider configuration section

             {
                  name: 'ui.grid',
                  files: [
                      'vendor/modules/angular-ui-grid/ui-grid.min.css',
                      'vendor/modules/angular-ui-grid/ui-grid.min.js'
                  ]
              },
              {
                  name: 'ui.grid.resizeColumns',
                  files: [
                      'vendor/modules/angular-ui-grid/ui-grid.min.css',
                      'vendor/modules/angular-ui-grid/ui-grid.min.js'
                      
                  ]
              },
              {
                  name: 'ui.grid.expandable',
                  files: [
                      'vendor/modules/angular-ui-grid/ui-grid.min.css',
                      'vendor/modules/angular-ui-grid/ui-grid.min.js'
                      
                  ]
              },
          

ui-router part

.state('app.account.account_M',{
                  url:'/account_M',
                  templateUrl:'tpl/account_account_M.html',
                  resolve: {
                     deps: ['$ocLazyLoad',
                        function( $ocLazyLoad ){
                          return $ocLazyLoad.load(['ui.grid','ui.grid.resizeColumns','ui.grid.expandable']).then(
                              function(){          
                                  return $ocLazyLoad.load('js/controllers/account_M.js');
                              }
                          );
                      }]
                  }
              })
          

But it definitely can’t be like this. This should load ui-grid.min.js and css multiple times. What should I do? Please give me some advice

漂亮男人漂亮男人2867 days ago640

reply all(1)I'll reply

  • 巴扎黑

    巴扎黑2017-05-15 17:09:58

    {
              name: 'ui.grid.*',
              files: [
                'static/bower_components/angular-ui-grid/ui-grid.min.js',
                'static/bower_components/angular-ui-grid/ui-grid.min.css',
                'static/bower_components/angular-ui-grid/ui-grid.css'
              ]
    }

    Issues I saw before

    reply
    0
  • Cancelreply