作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
当我在浏览器(通过 ionicserve
)和我的设备上加载 Ionic 应用程序时,出现非常常见的设备未定义
错误。
我是 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
很明显,我试图在一切“准备好”之前使用该设备,但我似乎不知道哪里出了问题。有什么建议吗?
最佳答案
错误不在您发布的代码中(您需要类似 this.device.foo
的内容才能收到错误,但您的代码中没有这样的 .foo
) 。
JS 文件的顺序可能会导致这种情况。更改:
<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 -->
致:
<!-- 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 -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
关于javascript - "device is not defined": Codrova/Ionic + TypeScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30876694/
当我在浏览器(通过 ionicserve)和我的设备上加载 Ionic 应用程序时,出现非常常见的设备未定义错误。 我是 TypeScript 的新手,我认为我的问题可能与其中的一些误解有关。 我的
我是一名优秀的程序员,十分优秀!