一、動態(tài)Title在單頁應(yīng)用中的重要性

在AngularJS單頁應(yīng)用(SPA)開發(fā)中，動態(tài)修改頁面標(biāo)題是提升用戶體驗的關(guān)鍵需求。然而iOS設(shè)備（特別是Safari和微信內(nèi)置瀏覽器）存在獨特機制：

• 頁面加載時鎖定Title：iOS首次加載后不再監(jiān)聽document.title變化
• 微信瀏覽器兼容問題：分享時仍顯示初始標(biāo)題
• SPA路由切換失效：傳統(tǒng)AngularJS方法在iOS上無響應(yīng)

二、AngularJS兼容iOS的Title動態(tài)解決方案

核心代碼實現(xiàn)：

<script>
angular.module('app').run(['$rootScope', '$timeout', 
  function($rootScope, $timeout) {
    $rootScope.$on('$stateChangeSuccess', (event, toState) => {
      // iOS兼容核心：異步強制重寫iframe觸發(fā)標(biāo)題刷新
      $timeout(() => {
        document.title = toState.data.title || '默認標(biāo)題';
        
        // iOS特殊處理
        if (/iPad|iPhone|iPod/.test(navigator.userAgent)) {
          const iframe = document.createElement('iframe');
          iframe.style.display = 'none';
          iframe.src = 'data:text/plain;base64,';
          document.body.appendChild(iframe);
          setTimeout(() => document.body.removeChild(iframe), 0);
        }
      }, 0);
    });
  }
]);
</script>

關(guān)鍵優(yōu)化點：

• 雙重異步保障：$timeout + setTimeout確保DOM更新
• 動態(tài)iframe注入：觸發(fā)iOS標(biāo)題刷新機制
• 路由監(jiān)聽集成：結(jié)合ui-router狀態(tài)機自動更新