“push()” to an array in Typescript

Question

I have the following code, to scan for a Bluetooth device, which for every device found, I want to add the device to an array.

devices: Observable<Array<string>>;

bluetoothAdd() {
    this.isScanning = true;
    var plusIcon = this.page.getViewById("add");
    plusIcon.style.opacity = 0;

    var self = this; 
    bluetooth.hasCoarseLocationPermission().then(
        function (granted) {
            if (!granted) {
                bluetooth.requestCoarseLocationPermission();
            } else {
                bluetooth.startScanning({
                    serviceUUIDs: ["133d"],
                    seconds: 4,
                    onDiscovered: function (peripheral) {
                        console.log("Periperhal found with UUID: " + peripheral.UUID);
                        this.devices.push(peripheral); // <- Problem Line
                    }
                }).then(function () {
                    console.log("scanning complete");
                    self.isScanning = false;
                    plusIcon.style.opacity = 1;
                }, function (err) {
                    console.log("error while scanning: " + err);
                });
                this.isScanning = false;
            }
        });
}

However, this code throws the following error:

JavaScript error: file:///app/Pages/Home/home.component.js:99:37: JS ERROR TypeError: undefined is not an object (evaluating 'this.devices.push')

I am working in Typescript, but I know the push function is a JS thing. Not sure how I would do this in Typescript - what have I done wrong?

Answer 1

It has nothing to do with TypeScript, it's just normal Javascript rules for this .

The problem this points to the function you give to onDiscovered instead of the class.

You can fix it by using the self variable you have defined or by rewriting the code to use arrow functions instead, like this:

devices: Observable<Array<string>>;

bluetoothAdd() {
    this.isScanning = true;
    var plusIcon = this.page.getViewById("add");
    plusIcon.style.opacity = 0;


    bluetooth.hasCoarseLocationPermission().then(
        (granted) => {
            if (!granted) {
                bluetooth.requestCoarseLocationPermission();
            } else {
                bluetooth.startScanning({
                    serviceUUIDs: ["133d"],
                    seconds: 4,
                    onDiscovered: (peripheral) => {
                        console.log("Periperhal found with UUID: " + peripheral.UUID);
                        this.devices.push(peripheral); // <- Problem Line
                    }
                }).then(() => {
                    console.log("scanning complete");
                    this.isScanning = false;
                    plusIcon.style.opacity = 1;
                }, (err) => {
                    console.log("error while scanning: " + err);
                });
                this.isScanning = false;
            }
        });
}

Also, as Bhabishya pointed out the type of devices is Observable. That type has no push method defined on it. Instead it will be able to emit an array of Devices.

If all you need is an array you should also change the devices to be an array of string, instead of an Observable of array of string.

devices: Array<string>;

You will also have to initialize it.

devices: Array<string> = [];

Answer 2

您已将设备定义为“可观察的阵列devices: Observable<Array<string>>而不是可在其上调用push（）函数的阵列devices: Array<string> 。