“设备未定义”:Codrova / Ionic + TypeScript

时间:2015-06-16 19:41:01

标签: javascript angularjs cordova typescript ionic

当我在浏览器(通过device is not defined)和我的设备上加载Ionic应用程序时,我收到了非常常见的ionic serve错误。

我是TypeScript的新手,我认为我的麻烦可能与那里的一些误解有关。

我的index.html包含(请注意我的DOM元素中缺少ng-app):

    <link href="css/ionic.app.min.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- inject:js -->
    <script src="lib/node_modules/ng-cordova/dist/ng-cordova-mocks.min.js"></script>
    <script src="lib/node_modules/ng-cordova/dist/ng-cordova.min.js"></script>
    <script src="lib/node_modules/ng-cordova/src/plugins/device.js"></script>
    <script src="lib/node_modules/ng-cordova/src/plugins/file.js"></script>
    <!-- endinject -->

    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>

</head>
<body>

  <div ui-view=""></div>

  <script src="app.js"></script>
  <script src="bootstrapApp.js"></script>

</body>

这里,app.js是从TypeScript编译的。我在这里有很多进展,但有趣的是这个:

var App;
(function (App) {
    "use strict";
    angular.module("app", [
        "ionic",
        "ngCordova",
        "ui.router"
    ])
    .config(function ($stateProvider, $urlRouterProvider) {
        $stateProvider.state("splash", {
            url: "/splash",
            templateUrl: "components/splash/splash.html",
            controller: "SplashController"
        });
        $urlRouterProvider.otherwise("/splash");
    });
})(App || (App = {}));
var App;
(function (App) {
    "use strict";
    var DeviceService = (function () {
        function DeviceService($cordovaDevice) {
            this.device = null;
            this.device = $cordovaDevice.getDevice();
            console.log(this.device);
        }
        DeviceService.$inject = ["$cordovaDevice"];
        return DeviceService;
    })();
    angular.module("app").service("DeviceService", DeviceService);
})(App || (App = {}));

为确保我的设备“准备就绪”,我遵循了我在此处找到的建议:https://stackoverflow.com/a/27975700/3817101

所以,我有一个bootstrapApp.js文件,其中包含:

window.ionic.Platform.ready(function() {
    console.log("platform is ready");
    angular.bootstrap(document, ['app']);
});

在页面加载时,除了$cordovaDevice的使用外,一切似乎都很满意。我的控制台上写着:

platform is ready
ionic.bundle.js:20306 ReferenceError: device is not defined

很明显,我试图在事情“准备好”之前使用设备,但我似乎无法弄清楚我哪里出错了。有什么建议吗?

1 个答案:

答案 0 :(得分:0)

错误不在您发布的代码中(您需要Base之类的内容来获取错误,而代码中没有SELECT cs_plz plz , cs_place place, cs_companies cmp , cs_businesscat bc, cs_trgtappm goal, cs_repeated rpt , (SELECT Count(call_id) FROM calls WHERE time_of_call > cs_assigndate AND time_of_call < cs_lastactivate AND call_sector = cs_id) calls, (SELECT Count(app_id) FROM appointments WHERE app_created > cs_assigndate AND app_created < cs_lastactivate AND app_callingnr IN ((SELECT c.calling_number FROM calls c WHERE c.time_of_call > cs_assigndate AND c.time_of_call < cs_lastactivate AND c.call_sector = cs_id))) appm, (SELECT Count(sale_id) FROM sales WHERE sale_created > cs_assigndate AND sale_created < cs_lastactivate AND sale_callingnr IN ((SELECT c1.calling_number FROM calls c1 WHERE c1.time_of_call > cs_assigndate AND c1.time_of_call < cs_lastactivate AND c1.call_sector = cs_id))) sales, (SELECT Count(subsc_id) FROM subscription WHERE subsc_date > cs_assigndate AND subsc_date < cs_lastactivate AND subsc_callingnr IN ((SELECT c2.calling_number FROM calls c2 WHERE c2.time_of_call > cs_assigndate AND c2.time_of_call < cs_lastactivate AND c2.call_sector = cs_id))) subsc FROM area_sector WHERE cs_lastactivate > Date_sub(Now(), interval 1 month) AND cs_repeated >= 1

解决方案

JS文件的排序可能导致这种情况。变化:

this.device.foo

致:

.foo