我是Angular 1的新手,必须在现有的Webapp上实现新功能。该应用程序使用jhipster生成后端和前端的某些部分(Angular 1和uirouter)。

因此,我尝试使用自己的路由和state这样,主要是从webapp的现有组件复制和粘贴:

(function() {
    'use strict';

    angular
        .module('artemisApp')
        .config(stateConfig);

    stateConfig.$inject = ['$stateProvider'];

  function stateConfig($stateProvider) {
    $stateProvider
      .state('model-comparison-exercise-for-course', {
        parent: 'entity',
        url: '/course/{courseid}/model-comparison-exercise',
        data: {
            authorities: ['ROLE_ADMIN', 'ROLE_TA'],
            pageTitle: 'artemisApp.modelComparisonExercise.home.title'
        },
        views: {
            'content@': {
                templateUrl: 'app/entities/model-comparison-exercise/model-comparison-exercise.html',
                controller: 'ModelComparisonExerciseController',
                controllerAs: 'vm'
            }
        },
        resolve: {
            translatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate, $translatePartialLoader) {
                $translatePartialLoader.addPart('modelComparisonExercise');
                $translatePartialLoader.addPart('exercise');
                $translatePartialLoader.addPart('global');
                return $translate.refresh();
            }],
            courseEntity: ['$stateParams', 'Course', function ($stateParams, Course) {
                return Course.get({id: $stateParams.courseid}).$promise;
            }]
        }
    });
}

})();


然后,我尝试使用以下代码打开此路由:

<a ui-sref="model-comparison-exercise-for-course({courseid:course.id})"
   data-translate="artemisApp.course.modelComparisonExercises"></a>


通过单击该链接,将触发http get请求,该请求将返回http状态代码404:http://localhost:8080/app/entities/model-comparison-exercise/model-comparison-exercise.html

实际上,应该打开的网址是http://localhost:8080/#/course/1/model-comparison-exercise

知道我可能配置错误吗?

最佳答案

请尝试将'content@'更改为'content@artemisApp'

here所述:


  @之前的符号是您要匹配的视图的名称,@之后的符号是对ui-view指令应位于的模板状态的引用。


并且<a>标记未关闭:

<a ui-sref="model-comparison-exercise-for-course({courseid:course.id})"
   data-translate="artemisApp.course.modelComparisonExercises"></a>


搜索代码后,我发现文件夹model-comparison-exercise.html中不存在model-comparison-exercise。除了model-comparison-exercises.html存在。

09-26 05:06