Question

我试图在我的Angular 1.5（+ Typescript）项目中使用angular new router。

我按照入门手册进行操作，但它强制我将所有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

Answer 1

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

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

templateUrl - {string = | function（）=} - 返回a的路径或函数   应该由ngView使用的html模板的路径。

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

{Array。} - 从当前提取的路由参数   $ location.path（）通过应用当前路线

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

更新：你想使用那个特定的。$ 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'作为你的应用程序的依赖。

根目录下的Angular new router force components文件夹

1 个答案: