• Angularjs学习笔记2_添加删除DOM元素


    1.调用element方法

        angular.element(html) 把字符串或dom对象转化成一JQuery对象,
        angular.element(document.getElementById("control")).append(newHtml); 在id为control<div>元素里内添加新对象,新对象在添加前需$compile编译过

        <div ng-controller="c10_1" class="frame" id="control">
            <button ng-click="add()">添加元素</button>
            <button ng-click="del()">删除元素</button>
        </div>
        <script type="text/javascript">
          angular.module('a10_1', [])
          .controller('c10_1', function ($scope, $compile) {
            $scope.hello = 'Hello,Angular!';
            $scope.log = function() {
              console.log('这是动态添加的方法!');
             }//添加元素及其对象方法加变量
            var html = "<div ng-click='log()'>{{hello}}</div>";
             var template = angular.element(html);
             var newHtml = $compile(template)($scope);
            $scope.add = function () {
               angular.element(document.getElementById("control")).append(newHtml);
            }
             $scope.del = function () {
              if (newHtml) {
                newHtml.remove();
              }
            }
          });
        </script>

    2.使用ng-show

     待续

     

  • 相关阅读:
    文章分类
    多项式笔记(二)
    P7102 [w3R1] 算
    P3711 仓鼠的数学题
    常见特殊数的多项式求法
    P4091 [HEOI2016/TJOI2016]求和
    CF961G Partitions
    P4609 [FJOI2016]建筑师
    P5401 [CTS2019]珍珠
    P5162 WD与积木
  • 原文地址:https://www.cnblogs.com/dengzy/p/5358071.html
Copyright © 2020-2023  润新知