cari

Rumah  >  Soal Jawab  >  teks badan

angular.js - 关于 angular 几个问题

现有 angularjs 问题俩枚

一.
通过 $http 加载了一篇文章,该文章有标题, 现想实现文章加载后将文章标题替换掉浏览器标题. html 结构如下

<!doctype html>
<html data-ng-app="app">
<head data-ng-controller="head">
 <meta charset="utf-8"/>
 <titlte data-ng-bind="title||'Document'"></title>
</head>
<body>
 <p data-ng-controller="main">
  <button data-ng-click="getPost()">GET POST</button>
  <p data-ng-module="post">
   <h2 data-ng-bind="post.title"></h2>
   <article data-ng-bind="post.content"></article>
  </p>
 </p>
</body>
</html>

也就是 post 加载后浏览器标题和 post.title 显示一样.
已搜索过跨域通信的解决方案, 并且看到了 这里(AngularJS控制器controller如何通信？) , 这三种方法, 前俩种并部适合我当前这个结构, 因此使用第三种方式, 并且也是实现了同步, 但是致命的是需要通过一个触发(点击 等)才能够同步, so 其实直白了就是想问问怎么能够自动同步 而不是通过触发来同步.

二.
$scope 回调,
还拿这个加载文章来说, 比如加载的文章中有 pre 标签包裹的代码快, 在加载后, 要通过其他库来实现高亮, so 需要在数据绑定并且渲染完毕后来执行高亮操作. 但是并没有搜到什么解决方案.
自己也写了些, 俩中方案
第一种:
数据绑定后以后递归查询当前页面的所有 pre 标签, 找到后或者限定次数后 高亮 结束.
第二种:
window.setTimeout(function(){}, 1000);
俩中结果了, 第一种是不行的. 无论递归多少次都无法找到 pre 标签
第二种可行, 不过感觉这并不是一个好的解决方案

过去多啦不再A梦过去多啦不再A梦2744 hari yang lalu542

membalas semua(2)saya akan balas

  • 巴扎黑

    巴扎黑2017-05-15 16:54:56

    Tidak faham apa yang anda maksudkan dengan komunikasi merentas domain? Mungkinkah ia komunikasi antara pengawal? Dan pencetus?

    1. Hanya tulis ng-bind terus tanpa menggunakan data-* seperti ini
    2. Pengawal di mana <title> terletak berada pada tahap yang sama dengan pengawal main. Anda boleh menambah pengawal induk di luar mereka dan mainController.$scope.$parent.title = post.title, atau menggunakan $rootScope secara langsung (tidak disyorkan). Anda juga boleh melakukan ini melalui $emit/$broadcast/$on tetapi ia tidak perlu.
    Kemudian: 

    <title ng-bind="$parent.title||'Default Title'"></title>

    3. Anda boleh mencari beberapa pemalam penyerlahan yang bagus pada github menggunakan angular highlight sebagai kata kunci. pemasangan bower
    4. Jangan gunakan window.setTimeout Gunakan $timeout() yang disediakan oleh sudut.
    5. Sebenarnya, cara yang lebih baik untuk menyelesaikan masalah kedua ialah menggunakan perkhidmatan $resource.get().$promise.then(); // atau $http untuk memastikan data jauh dimuatkan sebelum pelaksanaan.

    balas
    0
  • PHP中文网

    PHP中文网2017-05-15 16:54:56

    Tambahkan kelas wtitle pada elemen tajuk dalam templat yang memaparkan artikel dan tajuk halaman semasa akan ditukar kepada tajuk artikel.
    Anda juga boleh melakukannya dalam WeChat~

    Fungsi wtitle adalah untuk menetapkan kandungan element.text() sebagai document.title Tujuan menggunakan iframe adalah untuk menjadikannya berkesan dalam paparan web apl

    javascriptapp.directive('wtitle', [
  '$timeout',
  '$document',
  function($timeout, $document){
    return {
      restrict: 'AC',
      link: function($scope, $element, $attrs){
        var watch = $scope.$watch(function(){
          return $element.text().replace(/(^\s*)|(\s*$)/g, '');
        }, function(title){
          // 空标题不显示
          if(/^\s*$/.test(title)){
            return;
          }
          $document[0].title = title;
          var $body = angular.element($document[0].body);
          var $iframe = angular.element('

<iframe style="visibility:hidden;" src="/path/to/iframe.png"></iframe>

');
          $iframe.on('load', function(){
            $timeout(function(){
              $iframe.off('load').remove();
            }, 5);
          });
          $body.append($iframe);
        });

        $scope.$on('$destroy', watch);
      }
    };
  }
]);

    balas
    0
  • Batalbalas