0

我正在尝试在我的 Angular 1.5（+ Typescript）项目中使用 Angular新路由器。

我遵循了入门手册，但它迫使我将所有 HTML 组件文件夹都放在我的根文件夹下：

无法实例化控制器 HomeController

http://localhost:8083/components/home/home.html 404（未找到）

我可以改变它吗？

我的路由代码是：

this.$router.config([
      { path: '/', redirectTo: '/home' },
      { path: '/home', component: 'home' }}
]);

我的组件是：

namespace app.dashboard {
    'use strict';

    class HomeController {
    }

    angular.module('app.dashboard')
        .component('home', {
            templateUrl: 'app/dashboard/components/home.html',
            controller: HomeController,
            controllerAs: 'HomeController',
            bindings: {}
        });
}

我的嵌套文件夹是根路径下的 app/dashboard/components

4

1 回答 1

1

要将您的 html 放在其他地方，您需要指定 templateURL，例如：

this.$router.config([
      { path: '/', redirectTo: '/home' },
      { path: '/home', component: 'home' },
      { path: '/login', component: 'login', templateUrl: '/views/login' }
]);

templateUrl – {string=|function()=} – 路径或函数，返回指向 ngView 应使用的 html 模板的路径。

如果 templateUrl 是一个函数，它将使用以下参数调用：

{Array.} - 通过应用当前路由从当前 $location.path() 中提取的路由参数

您可以在此链接上找到有关生根的更多信息。在 templateUrl 下，您可以指定不带扩展名的文件路径。

更新：您想使用特定的 this.$router.config 吗？我问这个是因为你可以这样：

app.config(['$stateProvider', '$locationProvider', function ($stateProvider, $locationProvider) {

        // UI States, URL Routing & Mapping. For more info see: https://github.com/angular-ui/ui-router
        // ------------------------------------------------------------------------------------------------------------
        $stateProvider
            .state('home', {
                url: '/',
                templateUrl: '/views/index',
                controller: 'HomeCtrl'

            });
}]);

而且你不需要使用组件，我认为生根也是一样的，但你需要将'ui.router'作为依赖项添加到你的应用程序中。

于 2016-02-24T11:56:44.740 回答