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
待续