Question

有问题的应用程序在最新版本的Chrome，FF和Edge中正常加载。尝试使用IE11加载它时，似乎无法创建适当的数据绑定。正在从websocket连接正确处理内部数据，但没有发生数据绑定，模板仍为空。

我得到的唯一实际错误提示是＆＃34; HTML1506 - 意外令牌。＆＃34;信息。它描述发生在加载实际webint.js的标签上。

应用程序使用以下配置构建：

tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "outDir": "./",
        "rootDir": "src"
    },
    "exclude": [
        "node_modules",
        "typings/main",
        "typings/main.d.ts"
    ]
}

webpack.config.json

var CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');

module.exports = {
  devtool: 'eval',
  entry: './src/app/boot.ts',
  output: {
    filename: './dist/resources/webint.js'
  },
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.js']
  },
  module: {
    loaders: [
      { 
            test: /\.ts$/, 
            loader: 'ts-loader',
            exclude: [/node_modules\/(?!(ng2-.+))/]
        }
    ]
  },
  node: {
      tls: 'empty',
      fs: 'empty'
    },
    plugins: [            
        new CopyWebpackPlugin([
            { from: 'dist_template', to: 'dist', force: true },
        ])
    ]    
}

的package.json

{
  "name": "vwebinterface",
  "version": "0.0.1",
  "description": "Interface accessing the websocket API",
  "scripts": {
    "build": "webpack --progress --profile --colors --display-error-details --display-cached",
    "watch": "webpack --watch --progress --profile --colors --display-error-details --display-cached",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
  },
  "license": "UNLICENSED",
  "dependencies": {
    "@angular/common": "2.0.0-rc.4",
    "@angular/compiler": "2.0.0-rc.4",
    "@angular/core": "2.0.0-rc.4",
    "@angular/forms": "0.2.0",
    "@angular/http": "2.0.0-rc.4",
    "@angular/platform-browser": "2.0.0-rc.4",
    "@angular/platform-browser-dynamic": "2.0.0-rc.4",
    "@angular/router": "3.0.0-beta.2",
    "@angular/router-deprecated": "2.0.0-rc.2",
    "@angular/upgrade": "2.0.0-rc.4",
    "core-js": "^2.4.0",
    "es6-promise": "3.2.1",
    "es6-shim": "0.35.1",
    "moment": "^2.14.1",
    "primeng": "1.0.0-beta.9",
    "primeui": "4.1.12",
    "reflect-metadata": "0.1.3",
    "rxjs": "5.0.0-beta.6",
    "systemjs": "0.19.31",
    "zone.js": "0.6.12"
  },
  "devDependencies": {
    "clean-webpack-plugin": "0.1.9",
    "concurrently": "2.2.0",
    "copy-webpack-plugin": "3.0.1",
    "lite-server": "2.2.2",
    "ts-loader": "0.8.2",
    "typescript": "1.8.10",
    "typings": "1.3.1",
    "webpack": "1.13.1"
  }
}

的index.html

<!DOCTYPE html>
<html>

  <head>
    <title>Virtual Channel Server</title>

    <link rel="stylesheet" type="text/css" href="resources/bootstrap/theme.css" />
    <link rel="stylesheet" type="text/css" href="resources/icons/css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="resources/css/primeui.css" />
    <link rel="stylesheet" type="text/css" href="resources/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="resources/css/bootflat.css">
    <link rel="stylesheet" type="text/css" href="resources/css/webinterface.css">

    <script src="resources/libs/ieCompat/shims_for_IE.js"></script>
    <script src="resources/libs/ieCompat/system-polyfills.js"></script>
    <script src="resources/libs/ieCompat/es6-shim.js"></script>

    <script src="resources/libs/core/core.js"></script>

    <script src="resources/libs/zone.js/zone.js"></script>
    <script src="resources/libs/reflect-metadata/Reflect.js"></script>
    <script src="resources/libs/systemjs/system.js"></script>    
    <script src="resources/libs/jquery/jquery.js"></script>
    <script src="resources/libs/jquery/jquery-ui.js"></script>
    <script src="resources/libs/primeUI/primeui.js"></script>
    <script src="resources/libs/xml2json/xml2json.js"></script>
    <script src="resources/libs/deep-diff/deep-diff.js"></script>   
  </head>

  <body>
    <ng-channels>Loading...</ng-channels>
  </body>
  <script src="resources/webint.js"></script>
</html>

index.html包含我尝试在不同配置中使用的所有可能的IE填充程序，但没有实际效果。

Answer 1

您可以尝试创建一个本地字段，并使用组件内的setTimeout更新它。机会是，它更新你创建的绑定和从Web套接字收到的值。如果是这样，你可能想看看我前段时间创建的the following issue。那里还有一个解决方案提案。

Angular2数据在IE11中没有绑定

1 个答案: