0

I'm using angular cli.

I don't really understand whether I can use array.prototype.includes in my angular html template code.

If I try using array.prototype.includes in my .ts code, the typescript compiler throw an error message

Property 'includes' does not exist on type 'Answer[]'

From the following link, https://github.com/AngularClass/angular2-webpack-starter/issues/931, it looks like I have to modify the tsconfig.json file to specify es7 as a lib, instead of es6. This works for .ts files.

However, is there anyway to be able to use array.prototype.includes in my angular 2 html templates and have it converting to es5 equivalent?

<span [class.incorrect]="displayAnswer && !answer.correct && userAnswers.includes(answer)">Answer 2</span>

I know .includes calls are left as is, as they throw an error when I run the application on IE 11. 

Object doesn't support property or method 'includes'

Or do I need to use a polyfill or something?

Here is my tsconfig.json file

{
"compilerOptions": {
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": ["es6", "dom"],
"mapRoot": "./",
"module": "es6",
"moduleResolution": "node",
"outDir": "../dist/out-tsc",
"sourceMap": true,
"target": "es5",
"typeRoots": [
  "../node_modules/@types"
]
}
}

Thanks

David
  • 33,444
  • 11
  • 80
  • 118
  • 2
    `includes` is a part of ES2016. You need to add `es2016` to `lib`. And obviously, provide a polyfill for it. – Estus Flask Dec 13 '16 at 10:22
  • Ok, I thought that the html template whould somehow be transpiled to plain js. I'll use a polyfill, thanks – David Dec 13 '16 at 21:43

0 Answers0