使用 Ionic + TypeScript + Angular 的混合应用程序

Posted 2023-03-13

【中文标题】使用 Ionic + TypeScript + Angular 的混合应用程序

【英文标题】：hybrid app using Ionic + TypeScript + Angular

【发布时间】：2015-08-17 08:19:11

【问题描述】：

嘿，我使用 Ionic + Typescript + Angular 开发了混合应用程序。 我使用了 Ionic lib 的 beta 版本，它运行良好，但是当我将我的 ionic lib beta 版本更新到 1.0.0 版本时，我从 ionic.bundle.js 收到以下错误

错误：[ng:areq] 参数“AppCtrl”不是函数，未定义 http://errors.angularjs.org/1.3.13/ng/areq?p0=AppCtrl&p1=not%20a%20function%2C%20got%20undefined minErr/

AppCtrl.ts

angular.module('starter.controllers',[]);

class AppCtrl

    constructor($scope, $ionicModal, $timeout)
    
         // Form data for the login modal
          $scope.loginData = ;

          // Create the login modal that we will use later
          $ionicModal.fromTemplateUrl('templates/login.html', 
            scope: $scope
          ).then(function(modal) 
            $scope.modal = modal;
          );

          // Triggered in the login modal to close it
          $scope.closeLogin = function() 
            $scope.modal.hide();
          ;

          // Open the login modal
          $scope.login = function() 
            $scope.modal.show();
          ;

          // Perform the login action when the user submits the login form
          $scope.doLogin = function() 
            console.log('Doing login', $scope.loginData);
            $timeout(function() 
              $scope.closeLogin();
            , 1000);
          ;
    

我已经在 Typescript 中编写了我的控制器，并将其编译为 js，然后在我的应用程序中使用。

App.js

在 app.js 中，我注入我的控制器，如下所示：

angular.module('starter', ['starter.controllers', 'ionic')

【问题讨论】：

尝试将导出修饰符添加到类声明typescriptlang.org/Handbook#modules-export-

如果我使用了导出，那么我也会出错

module starter.controllers export class AppCtrl constructor($scope, $ionicModal, $timeout)

尝试在控制器声明之前移动类声明 angular.module('starter.controllers').controller('AppCtrl', AppCtrl)

【参考方案1】：

只需以如下角度方式引用您的控制器，您就可以开始了:-)

angular.module('starter.controllers')
  .controller('AppCtrl', AppCtrl);

【参考方案2】：

我的问题得到了解决方案-

模块 DemoNS 导出类 AppCtrl

constructor($scope, $ionicModal, $timeout) 

//your stuff

angular.module('starter.controllers',[]).controller("AppCtrl", ["$scope","$ionicModal","$timeout", DemoNS.AppCtrl]);