2

我最近购买了一个angularjs模板，我用它来构建我的应用程序，但是我注意到使用了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-router后如何处理这一部分。

4

1 回答 1

1

resolve 属性本质上告诉 angularjs，其中的回调必须在状态显示之前完成。NgRouter 有这个，但 ui-router 也有。这里有一些读物给你。

此代码应该可以工作：

.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");
            })

        }]
    }
})
于 2015-07-17T17:44:50.293 回答