angularjs – 如何动态创建具有某个类的角度的div？

发布时间：2020-12-17 06:48:58 所属栏目：安全来源：网络整理

导读：我想点击一个按钮创建一个div： div应该是这样的： div class="my-blur"div 我这样做： $scope.showFloatingActioButtons = function() { var newEle = angular.element('div class="my-blur"/div'); $compile(newEle)($scope);} 解决方法你几乎就在那里…

我想点击一个按钮创建一个div：

div应该是这样的：

<div class="my-blur"><div>

我这样做：

$scope.showFloatingActioButtons = function() {
        var newEle = angular.element('<div class="my-blur"></div>');
        $compile(newEle)($scope);
}

解决方法

你几乎就在那里……你只需要将这个元素添加到DOM中.

angular.element('someselector-or-dom-element').append(newEle);

除非你对新元素有绑定或指令,否则没有理由编译它.

我添加了一个运行示例来帮助消除任何混淆.

var app = angular.module('my-app',[]);

function MyCtrl(){}
MyCtrl.prototype = {
  addElement:function(){
    var newEle = angular.element("<div class='red'></div>");
    var target = document.getElementById('target');
    angular.element(target).append(newEle);
  }
};

app.controller('myCtrl',MyCtrl);

.red{
  margin: 10px;
  height:20px;
  background-color:red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<div ng-app="my-app" ng-controller="myCtrl as $ctrl">
  <button type="button" ng-click="$ctrl.addElement()">Add Element</button>
  <div id="target"></div>
</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!