document.getElementById().value 沒有返回正確的值

Question

我正在嘗試在 Pepper 機器人的平板電腦上創建一個輸入字段，允許用戶通過語音輸入他們的 email 地址。 我使用語音識別框來獲取用戶所說的字母並引發一個事件，以便 Javascript 可以捕獲它並修改文本。 但似乎 "document.getElementById("abc").value" 永遠不會得到當前屏幕上的內容，而是默認值。

示例：我說“1”，它顯示“hello1”（完全好）。 然后我說“2”，它顯示“hello2”（期待“hello12”）

這是我的 JS 代碼：

var session = new QiSession(function(session) {
            // "Connection esterblished!";
          }, function() {
            // "Could not connect to the robot";
          });

// Subscribe to ALMemory Service   
session.service("ALMemory").then(function(ALMemory) {
  // "ALMemory proxy subscription successful!";  
  ALMemory.getData('voice_input').then(function(voice_input){  
        document.getElementById("abc").value += voice_input;        
  });

});

HTML 代碼：

<input type="text" name="email" id="abc" value="hello">

與“會話”有什么關系嗎？ 因為即使我使用一個全局變量來存儲語音輸入，我也只能修改這個變量的值，而不能在函數內部得到這個變量的當前值（我能得到的是初始化值）。

Answer 1

不幸的是，我無法在 JavaScript API 上找到適當的公共文檔。 但是，這是我能找到的。

看來您正在使用 Promise 作為事件偵聽器。 Promise 觸發一次，而事件偵聽器重復觸發。 您正在使用他們所說的調用（承諾）而不是信號（事件）。 如果您有關於信號的文檔，我會改用它們，因為它們更類似於您正在嘗試做的事情。 否則，您可以執行以下操作：

var session = new QiSession(function(session) {
    // "Connection esterblished!";
    // Subscribe to ALMemory Service
    session.service("ALMemory").then(function(ALMemory) {
        // "ALMemory proxy subscription successful!";
        function getVoice() {
            ALMemory.getData('voice_input').then(function(voice_input){
                document.getElementById("abc").value += voice_input;
                getVoice();
            });
        }
        getVoice();
    });
}, function() {
    // "Could not connect to the robot";
});

首先，我將服務訂閱者移動到 QiSession 成功連接的回調中，因為這通常是在異步 function 調用中定義 session 的地方。 當 ALMemory 被訂閱時，它定義並調用 getVoice，它檢索用戶的語音，附加到字段，然后再次運行 getVoice 以排隊另一個聽。 您可能希望添加一個條件來最終停止它。 如果 Pepper 支持這一點，也可能值得研究 async/await，因為這樣你就可以使用 while 循環輕松地做到這一點。

Answer 2

document.getElementById()沒有任何問題。 問題是您必須對語音輸入做出反應，而不僅僅是獲取當前的語音輸入。 這是通過訂閱 ALMemory 事件來完成的。 這是大致適合您的案例的教程片段（但未經測試）：

session.service("ALMemory").then(function (ALMemory) {
  ALMemory.subscriber("voice_input").then(function (subscriber) {
    subscriber.signal.connect(function (state) {
      document.getElementById("abc").value += voice_input;
    });
  });
});

請注意，要工作，您必須使用ALMemory.raiseEvent在"voice_input"鍵上發布事件。