Problems with text to speech

ionic-v1
1

I’m brand new to Ionic, have quite a bit of experience with AngularJS

I’m trying to included a text to speech feature in my app. I used the following plugin:

cordova plugin add org.apache.cordova.plugin.tts

My desktop browser speaks just fine with:

Ionic serve

But when I upload the app to my Samsung GS4 (Ionic run android) it never speaks.

What am I missing?

.run(function($ionicPlatform) {
 $ionicPlatform.ready(function() {

if (window.cordova && window.cordova.plugins.Keyboard) {
  cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
  cordova.plugins.Keyboard.disableScroll(true);

}
//just to to test it out quickly.
var speech = new SpeechSynthesisUtterance('hello world');
speech.lang = 'en-US';
speechSynthesis.speak(speech);


if (window.StatusBar) {
  // org.apache.cordova.statusbar required
  StatusBar.styleDefault();
}

  });
})
2

Have you debugged your app and are you receiving any errors?

3

I actually just found this plugin which supports both platforms:

I get an “Uncaught ReferenceError: TTS is not defined” error when I put this in my run function:

TTS
    .speak('hello, world!', function () {
        alert('success');
    }, function (reason) {
        alert(reason);
    });

Do I need to include that second block of text in the read me? I’m not sure how or where to do that…

4

Got it working. Just needed to add “window”

window.TTS.speak(‘blah blah blah’)

5

Hi @soupman99,

I’m trying to do the same in my sample app, Following are the things I have done

1 - install cordova plugin add cordova-plugin-tts

   .controller('DashCtrl', function($scope) {
    
      window.TTS.speak('blah blah blah', function(){
      }, function(){
      })
    })

and I’m getting Cannot read property 'speak' error. I’m missing the module name after $scope in controller, but I’m not sure what to put there (I tried tts and didnt work)

appreciate if you could point me to right direction, thanks a lot

6

Hello @sameera207,

I has try the same and I has needed to install cordova plugin add cordova-plugin-tts

Then, I has used the next code:

    TTS
        .speak({
            text: $scope.color,
            locale: 'es-ES',
            rate: 0.75
        }, function () { alert("success");
    },
    function (reason) {
    });

(without window before TTS) and it’s works IN DEVICE not using “ionic serve”. When you use navigator you get an undefined error.

7

hey @jakama, :thumbsup:, it worked… I had to run it in the real phone with your code, thanks a lot

8

sorry, I can not implement this plugin, someone can show all the steps to succeed?

for now I added the plugin to my project, and copy the code in the controllers, but nothing.

I tried the app on my iOS device, on the browser and on the Android emulator
I have to do? add the module? where am I wrong?

the error is always “TTS is undefined”.

thanks a lot

9

try this - keep in mind that this works only while running with an emulator or device

if (window.cordova) {
        TTS
          .speak({
            text: 'hello world!',
            locale: 'en-GB',
            rate: 1.1
          }, function () {
          }, function (reason) {
          });
    }
1 Like
10

this plugin support Arabic language ?

11

@jakama : Initially I was trying in rippl, later when I deployed my app in mobile it worked :slight_smile: tested in both Android 5 and 6 working perfectly fine :slight_smile:

12

I need proper code files.

13

I need code source code.

14

Hi,
I am trying to use TTS.tts and passing a long string approx 5000 charecters but it it not speaking while shrten the string with less then 4000 charetcerts, it is speaking the text.

$scope.speakText = function(text) {
console.log(text);
console.log($scope.data[text]);
$scope.showSpeakBtn = false;
$scope.showStopBtn = true;

if (window.cordova) {
TTS.speak({
text: $scope.data[text],
locale: ‘en-US’,
rate: 1.0
}, function () {

       // Do Something after success

   }, function (reason) {
       // Handle the error case
   });
}

}

Please suggest how to resolve this.