ngRouter 到 ui-router

Question

我最近购买了一个 angularjs 模板，我用它来构建 uild 我的应用程序，但是我注意到 ngRouter 被用来代替 ui-router 我更喜欢也更熟悉。

我尝试包括 ui-router 并更改所有路由并且它有效，但是我的路由中有一些我仍然不理解的额外代码并且不知道放在哪里，这是我仪表板的旧路线：

$routeProvider.when("/dashboard", {
    templateUrl: "views/dashboard.html",
    resolve: {
        deps: ["$ocLazyLoad", function(a) {
            return a.load([jqload.c3, jqload.sparkline])
            .then(function() {
                return a.load({
                    name: "app.directives",
                    files: ["scripts/lazyload/directives/sparkline.directive.js"]
                })
            })
            .then(function() {
                return a.load("angular-c3");
            })
            .then(function() {
                return a.load("easypiechart");
            })

        }]
    }
});

这是我改成的：

.state('admin.dashboard', {
    url: '/dashboard',
    views: {
        'content@': {
            templateUrl: '/_admin/views/dashboard.html',
            controller: 'DashboardCtrl'
        }
    }

如您所见，缺少很大一部分代码，这会影响我仪表板的某些功能。我的问题是使用 ui-router 我应该把所有代码放在 resolve:

resolve: {
        deps: ["$ocLazyLoad", function(a) {
            return a.load([jqload.c3, jqload.sparkline])
            .then(function() {
                return a.load({
                    name: "app.directives",
                    files: ["scripts/lazyload/directives/sparkline.directive.js"]
                })
            })
            .then(function() {
                return a.load("angular-c3");
            })
            .then(function() {
                return a.load("easypiechart");
            })

        }]
    }

我以前从未接触过resolve，我是angularjs的新手ui并且不知道在切换到 ui-router.

之后如何处理此部分

Answer 1

解析属性本质上告诉 angularjs 其中的回调必须在显示状态之前完成。 NgRouter 有这个，但 ui-router 也有。 Here's some reading for you.

此代码应该有效：

.state('admin.dashboard', {
    url: '/dashboard',
    views: {
        'content@': {
            templateUrl: '/_admin/views/dashboard.html',
            controller: 'DashboardCtrl'
        }
    },
    resolve: {
        deps: ["$ocLazyLoad", function(a) {
            return a.load([jqload.c3, jqload.sparkline])
            .then(function() {
                return a.load({
                    name: "app.directives",
                    files: ["scripts/lazyload/directives/sparkline.directive.js"]
                })
            })
            .then(function() {
                return a.load("angular-c3");
            })
            .then(function() {
                return a.load("easypiechart");
            })

        }]
    }
})

ngRouter 到 ui-router

ngRouter to ui-router

javascript

angularjs

asynchronous

angular-ui-router

angularjs-ng-route