Vfrdtyky

I have a problem with my angular app on the Internet Explorer. It runs everywhere without a problem (Chrome, Mozilla, Edge), but on on the IE.

I have analyzed with the Developer Explorer where the error is and it returned that the error occurs on the following line:

myDataSet[index - 1].data = Array.from(tmp);

Where this is the following error message I am getting:

Object does not support property or method from at Anonymous function....(etc.)

What I am doing there is that I have a Set() named tmp which contains the following data:

Afterwards I am simply creating a simple array object from this Set.

How can I solve this problem?

EDIT

Based on the recommendations I have added the following code to my app:

if (!Array.from) {

  Array.from = (function () {

    var toStr = Object.prototype.toString;

    var isCallable = function (fn) {

      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';

    };

    var toInteger = function (value) {

      var number = Number(value);

      if (isNaN(number)) { return 0; }

      if (number === 0 || !isFinite(number)) { return number; }

      return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));

    };

    var maxSafeInteger = Math.pow(2, 53) - 1;

    var toLength = function (value) {

      var len = toInteger(value);

      return Math.min(Math.max(len, 0), maxSafeInteger);

    };



    // The length property of the from method is 1.

    return function from(arrayLike/*, mapFn, thisArg */) {

      // 1. Let C be the this value.

      var C = this;



      // 2. Let items be ToObject(arrayLike).

      var items = Object(arrayLike);



      // 3. ReturnIfAbrupt(items).

      if (arrayLike == null) {

        throw new TypeError("Array.from requires an array-like object - not null or undefined");

      }



      // 4. If mapfn is undefined, then let mapping be false.

      var mapFn = arguments.length > 1 ? arguments[1] : void undefined;

      var T;

      if (typeof mapFn !== 'undefined') {

        // 5. else

        // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.

        if (!isCallable(mapFn)) {

          throw new TypeError('Array.from: when provided, the second argument must be a function');

        }



        // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.

        if (arguments.length > 2) {

          T = arguments[2];

        }

      }



      // 10. Let lenValue be Get(items, "length").

      // 11. Let len be ToLength(lenValue).

      var len = toLength(items.length);



      // 13. If IsConstructor(C) is true, then

      // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.

      // 14. a. Else, Let A be ArrayCreate(len).

      var A = isCallable(C) ? Object(new C(len)) : new Array(len);



      // 16. Let k be 0.

      var k = 0;

      // 17. Repeat, while k < len… (also steps a - h)

      var kValue;

      while (k < len) {

        kValue = items[k];

        if (mapFn) {

          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);

        } else {

          A[k] = kValue;

        }

        k += 1;

      }

      // 18. Let putStatus be Put(A, "length", len, true).

      A.length = len;

      // 20. Return A.

      return A;

    };

  }());

}

Array.from not supported in the following document modes: Quirks, Internet Explorer 6 standards, Internet Explorer 7 standards, Internet Explorer 8 standards, Internet Explorer 9 standards, Internet Explorer 10 standards, Internet Explorer 11 standards. Not supported in Windows 8.1.

Just add the code below to your page (JS code was copied from developer.mozilla.org). It will emulate an ES6's Array.from method.

Array.from was added to the ECMA-262 standard in the 6th edition; as
such it may not be present in other implementations of the standard.
You can work around this by inserting the following code at the
beginning of your scripts, allowing use of Array.from in
implementations that don't natively support it. This algorithm is
exactly the one specified in ECMA-262, 6th edition, assuming Object
and TypeError have their original values and that callback.call
evaluates to the original value of Function.prototype.call. In
addition, since true iterables can not be polyfilled, this
implementation does not support generic iterables as defined in the
6th edition of ECMA-262.

if (!Array.from) {

  Array.from = (function () {

    var toStr = Object.prototype.toString;

    var isCallable = function (fn) {

      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';

    };

    var toInteger = function (value) {

      var number = Number(value);

      if (isNaN(number)) { return 0; }

      if (number === 0 || !isFinite(number)) { return number; }

      return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));

    };

    var maxSafeInteger = Math.pow(2, 53) - 1;

    var toLength = function (value) {

      var len = toInteger(value);

      return Math.min(Math.max(len, 0), maxSafeInteger);

    };



    // The length property of the from method is 1.

    return function from(arrayLike/*, mapFn, thisArg */) {

      // 1. Let C be the this value.

      var C = this;



      // 2. Let items be ToObject(arrayLike).

      var items = Object(arrayLike);



      // 3. ReturnIfAbrupt(items).

      if (arrayLike == null) {

        throw new TypeError("Array.from requires an array-like object - not null or undefined");

      }



      // 4. If mapfn is undefined, then let mapping be false.

      var mapFn = arguments.length > 1 ? arguments[1] : void undefined;

      var T;

      if (typeof mapFn !== 'undefined') {

        // 5. else

        // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.

        if (!isCallable(mapFn)) {

          throw new TypeError('Array.from: when provided, the second argument must be a function');

        }



        // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.

        if (arguments.length > 2) {

          T = arguments[2];

        }

      }



      // 10. Let lenValue be Get(items, "length").

      // 11. Let len be ToLength(lenValue).

      var len = toLength(items.length);



      // 13. If IsConstructor(C) is true, then

      // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.

      // 14. a. Else, Let A be ArrayCreate(len).

      var A = isCallable(C) ? Object(new C(len)) : new Array(len);



      // 16. Let k be 0.

      var k = 0;

      // 17. Repeat, while k < len… (also steps a - h)

      var kValue;

      while (k < len) {

        kValue = items[k];

        if (mapFn) {

          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);

        } else {

          A[k] = kValue;

        }

        k += 1;

      }

      // 18. Let putStatus be Put(A, "length", len, true).

      A.length = len;

      // 20. Return A.

      return A;

    };

  }());

}

I faced the same issue. Looked at the polyfill and it is threatening huge. Here is 2 lines short solution.

The OP basically needs to create simple array from his array-like object. I used to my taste the most efficient 2 lines plain for loop (I had to make array from HTML DOM nodelist array-like object, same applicable to JavaScript arguments object).

For the OP's case it could sound this way:

var temp_array = ,

    length = tmp.length;



for (var i = 0; i < length; i++) {

    temp_array.push(tmp[i]);

}



// Here you get the normal array "temp_array" containing all items

// from your `tmp` Set.

Make it separate function and you get 3 lines universal reusable solution for the IE<9 case.

Here is how the separate function may look like:

/**

 * @param arr The array | array-like data structure.

 * @param callback The function to process each element in the 'arr'.

 * The callback signature and usage is assumed similar to the 

 * native JS 'forEach' callback argument usage.

 */

function customEach(arr, callback) {

    'use strict';

    var l = arr.length;

    for (var i = 0; i < l; i++) {

        callback(arr[i], i, arr);

    }

};

PS: here is the relevant description for forEach callback to see how to use the customEach callback.

While it's not supported on IE, you may use the polyfill from MDN.