cari

Rumah  >  Soal Jawab  >  teks badan

angular.js - Bagaimana untuk menyusun dom yang dimasukkan secara manual dalam sudut?

Selepas melakukan beberapa operasi pada halaman, sekeping kod html akan dimasukkan
Bagaimana untuk menyusun html ini supaya peristiwa dan pembolehubah yang terikat padanya berkuat kuasa~

滿天的星座滿天的星座2779 hari yang lalu740

membalas semua(3)saya akan balas

  • PHP中文网

    PHP中文网2017-05-15 16:53:11

    Atas sebab keselamatan, acara Angular dalam kod HTML yang kami masukkan dan model ng terikat tidak akan berfungsi.

    Jika anda mahu ia berfungsi, anda perlu menggunakan perkhidmatan $compile angular

    Saya biasanya menggunakan arahan semasa memproses 

    javascriptangular.module(...).directive('jxbBindCompiledHtml', function ($compile) {
  'use strict';

  return {
    template: '

<p></p>

',
    scope: {
      rawHtml: '=jxbBindCompiledHtml'
    },
    link: function (scope, elem, attrs) {
      scope.$watch('rawHtml', function (value) {

        if (!value) {
          return;
        }

        // we want to use the scope OUTSIDE of this directive
        // (which itself is an isolate scope).
        var newElem = $compile($.parseHTML(value))(scope.$parent);
        elem.contents().remove();
        elem.append(newElem);
      });
    }
  };
});

    html

    html<p jxb-bind-compiled-html="htmlvariable">
</p>

    htmlvariable ialah pembolehubah kod html yang perlu disisipkan

    balas
    0
  • 迷茫

    迷茫2017-05-15 16:53:11

    http://stackoverflow.com/questions/11771513/angularjs-jquery-how-to-get-dynamic-content-working-in-angularjs

    balas
    0
  • 世界只因有你

    世界只因有你2017-05-15 16:53:11

    <!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>angular编译插入到dom的元素</title>
</head>
<body ng-controller="appCtrl">
    
    <!-- javascript
        ================================================== -->
    <script src="http://cdn.staticfile.org/jquery/2.1.0/jquery.min.js" type="text/javascript"></script>
    <script src="http://cdn.staticfile.org/angular.js/1.2.0rc3/angular.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var app = angular.module('app', []);
        app.controller('appCtrl', function ($scope, $compile) {
            $scope.arrs = [1,2,3,4,5,"成", "功", "编", "译"];
            var html = '<h1 ng-repeat="arr in arrs">{{ arr }}</h1>';
            
            // 编译html
            $html = $compile(html)($scope);
            // 插入到dom
            $('body').before($html);
        });
        angular.bootstrap(document, ['app']);
    </script>
</body>
</html>

    Saya menulis contoh, seperti di atas.

    balas
    0
  • Batalbalas