运行时错误非法状态：内容查询节点需要是指令的子节点，索引为 0！离子的

Question

我正在制作一个离子应用程序。我以前从未见过这个错误，如果有人记录过这个问题，我什至无法在 Internet 上的任何地方找到。

我什至无法弄清楚到底是什么导致了这个问题，因为我在错误日志中找不到任何有用的信息。

有没有人遇到过这个问题，如果遇到过，您是如何解决的。

Error: Illegal State: Content Query nodes need to be children of directives, at index 0!
at d (http://localhost:8100/build/polyfills.js:3:3991)
at validateNode (http://localhost:8100/build/main.js:12307:19)
at viewDef (http://localhost:8100/build/main.js:12204:9)
at View_IonicApp_0 (ng:///IonicModule/IonicApp.ngfactory.js:11:10)
at proxyClass (http://localhost:8100/build/main.js:102775:29)
at resolveViewDefinition (http://localhost:8100/build/main.js:9289:17)
at createViewNodes (http://localhost:8100/build/main.js:12399:56)
at createRootView (http://localhost:8100/build/main.js:12343:5)
at callWithDebugContext (http://localhost:8100/build/main.js:13558:42)
at Object.debugCreateRootView [as createRootView] (http://localhost:8100/build/main.js:13018:12)
at ComponentFactory_.create (http://localhost:8100/build/main.js:10264:46)
at ComponentFactoryBoundToModule.create (http://localhost:8100/build/main.js:3800:29)
at ApplicationRef_.bootstrap (http://localhost:8100/build/main.js:5384:57)
at http://localhost:8100/build/main.js:5173:79
at Array.forEach (native)

我的 package.json 文件：

{
  "name": "ionic-hello-world",
  "version": "0.0.0",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "^4.1.3",
    "@angular/compiler": "4.0.2",
    "@angular/compiler-cli": "4.0.2",
    "@angular/core": "^4.1.3",
    "@angular/forms": "4.0.2",
    "@angular/http": "4.0.2",
    "@angular/platform-browser": "4.0.2",
    "@angular/platform-browser-dynamic": "4.0.2",
    "@ionic-native/core": "3.6.1",
    "@ionic-native/geolocation": "^3.6.1",
    "@ionic-native/network": "^3.8.0",
    "@ionic-native/splash-screen": "3.6.1",
    "@ionic-native/status-bar": "3.6.1",
    "@ionic/storage": "2.0.1",
    "@types/decimal.js": "0.0.21-alpha",
    "@types/leaflet": "^1.0.60",
    "@types/long": "^3.0.31",
    "@types/node": "^7.0.22",
    "angular2-uuid": "^1.1.1",
    "aws-sdk": "^2.49.0",
    "cordova-android": "^6.2.3",
    "cordova-plugin-compat": "^1.1.0",
    "cordova-plugin-console": "1.0.5",
    "cordova-plugin-device": "1.1.4",
    "cordova-plugin-geolocation": "^2.4.3",
    "cordova-plugin-network-information": "^1.3.3",
    "cordova-plugin-splashscreen": "~4.0.1",
    "cordova-plugin-statusbar": "2.2.2",
    "cordova-plugin-whitelist": "1.3.1",
    "decimal": "0.0.2",
    "ionic-angular": "3.1.1",
    "ionic-plugin-keyboard": "~2.2.1",
    "ionicons": "3.0.0",
    "istanbul": "^0.4.5",
    "leaflet": "^1.0.3",
    "nodes2ts": "^1.1.9",
    "rxjs": "5.1.1",
    "sw-toolbox": "3.4.0",
    "zone.js": "^0.8.10"
  },
  "devDependencies": {
    "@angular/common": "^4.1.3",
    "@ionic/app-scripts": "1.3.7",
    "@ionic/cli-plugin-ionic-angular": "1.2.0",
    "@types/node": "^7.0.22",
    "typescript": "^2.2.1"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-console",
    "cordova-plugin-device",
    "cordova-plugin-statusbar",
    "ionic-plugin-keyboard",
    "cordova-plugin-splashscreen"
  ],
  "cordovaPlatforms": [],
  "description": "s: An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-console": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-whitelist": {},
      "ionic-plugin-keyboard": {},
      "cordova-plugin-geolocation": {}
    },
    "platforms": [
      "android"
    ]
  }
}

Answer 1

我遇到了同样的问题。解决方案是更新依赖项。这是来自 Ionic Conference App 的设置。我刚刚更新了我的 package.json 以使用最新的 angular 和 ionic-angular 参考，npm install 并且一切都再次运行。

{
  "name": "ionic-conference-app",
  "version": "0.0.0",
  "description": "Ionic Conference App",
  "license": "Apache-2.0",
  "repository": {
    "type": "git",
    "url": "https://github.com/ionic-team/ionic-conference-app.git"
  },
  "scripts": {
    "build": "ionic-app-scripts build",
    "clean": "ionic-app-scripts clean",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "4.1.2",
    "@angular/compiler": "4.1.2",
    "@angular/compiler-cli": "4.1.2",
    "@angular/core": "4.1.2",
    "@angular/forms": "4.1.2",
    "@angular/http": "4.1.2",
    "@angular/platform-browser": "4.1.2",
    "@angular/platform-browser-dynamic": "4.1.2",
    "@ionic-native/core": "3.10.2",
    "@ionic-native/in-app-browser": "3.10.2",
    "@ionic-native/splash-screen": "3.10.2",
    "@ionic-native/status-bar": "3.10.2",
    "@ionic/storage": "2.0.1",
    "ionic-angular": "3.3.0",
    "ionicons": "3.0.0",
    "rxjs": "5.1.1",
    "sw-toolbox": "3.4.0",
    "zone.js": "0.8.11"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.3.7",
    "@ionic/cli-plugin-ionic-angular": "1.2.0",
    "typescript": "2.3.3"
  },
  "config": {}
}

运行时错误非法状态：内容查询节点需要是指令的子节点，索引为 0！离子的

Runtime Error Illegal State: Content Query nodes need to be children of directives, at index 0! ionic

angularjs-directive

ionic-framework

ionic3

angular