AngularJs Ui-Router добавляет новые состояния в существующий app.config

Question

В настоящее время я работаю над очень масштабным приложением, которое включает в себя множество маршрутов для множества различных компонентов приложения.Моя команда и я решили попытаться разделить различные маршруты в свой собственный файл, а не иметь очень большой файл маршрутов.

Я попытался создать переменную и импортировать ее в мой app.js.файл и передача моего созданного объекта маршрута в новое состояние.

Я продолжаю сталкиваться с ошибками при попытке импортировать файл в файл app.js.

Я хочу знать, есть лиспособ передать объекты состояния из разных файлов в основной файл app.config?

Вот мой файл App.js, который работает со статически определенным состоянием

    let app = angular.module('ordyxApp', ['ui.router']);



app.config(function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/home');

    $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'pages/login.html'
        })
        .state(system)
}); 

Это то, что яя пытаюсь достичь

pages / clockIn / clockInRoute.js

export  let  ClockIn =  {
    url: '/clockIn',
    templateUrl: 'pages/clockIn/clockIn.html'
};

Тогда мой файл app.js будет выглядеть примерно так:

 let app = angular.module('ordyxApp', ['ui.router']);

import {ClockIn} from "./pages/clockIn/clockIn.route";

app.config(function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/home');

    $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'pages/login.html'
        })
        .state(ClockIn)
});

Answer 1

Вы должны установить имя для государства

stateProvider .state('home', {
 url: '/home',
 templateUrl: 'pages/login.html' 
}) 
.state('clockIn', ClockIn)