Question

我尝试使用angular和TypeScript创建SPA。我一直处理那些似乎微不足道的问题，但数小时的互联网服务却没有任何结果。

Application.ts

/// <reference path='_all.ts' />

module app {
    'use strict';
    angular.module('app.controllers',['ui.router'])
        .config(['$stateProvider', function ($stateProvider) {
            $stateProvider
                .state('review', {
                    url: "/review",`enter code here`
                    templateUrl: "assets/html/review.html",
                    controller: 'ReviewCtrl'
                })
                .state('games', {
                    url: "/games",
                    templateUrl: "assets/html/games.html"//,
                    //controller: 'controllers.GamesCtrl'
                })
                .state('rewards', {
                    url: "/rewards",
                    templateUrl: "assets/html/rewards.html"//,
                    //controller: 'controllers.RewardsCtrl'
                })
                .state('profile', {
                    url: "/profile",
                    templateUrl: "assets/html/profile.html"//,
                    //controller: 'controllers.ProfileCtrl'
                })
        }])
        .controller('ReviewCtrl', ReviewCtrl)
        .controller('GamesCtrl', GamesCtrl)
        .controller('RewardsCtrl', RewardsCtrl)
        .controller('ProfileCtrl', ProfileCtrl)


}

ReviewCtrl.ts

module app {
    'use strict';

    export class ReviewCtrl {

        public static $inject = ['$scope','$stateParams'];

        constructor(private $scope,
                    private $stateParams)
        {
                console.log($stateParams);

        }
    }
}

ui-view更改成功，但将控制器添加到状态对象导致＆＃34; [ng：areq]参数＆＃39; ReviewCtrl＆＃39;不是一个功能，未定义＆＃34;异常。

尝试排除.js文件中的状态，配置＆＃39; app.controllers＆＃39;模块，但结果是一样的。

我猜想，Typescript包含了一些控制器，但我已经尝试了app.controllers.ReviewCtrl＆＃39;，＃app; app.ReviewCtrl＆＃39;，＆＃39;控制器.ReviewCtrl＆＃39;而且我还在这里。

Answer 1

您是否尝试过切换.config（）和.controller（）的定义？我没有看到任何错误，但它可能在其他地方。也可能是你没有在_all.ts中定义控制器。

Answer 2

AngularJS不会包装您的控制器名称。通过将带有config函数的TS文件移动到javascript（JS）文件的末尾（编译顺序），我遇到了与您描述和解决的问题相同的问题。您可以这样做，将/// Reference...（依赖项）添加到包含控制器类的文件中。当然，还要将angular.module（..）。controller（..）语句移动到控制器类所在的相应TS文件中，以便在配置之前执行它们。

使用Typescript的Ui-router状态定义

2 个答案: