• angular添加删除dom


    HTML部分

     <div class="resumeInfo_box" ng-repeat="person in postList">
                <div class="box">
                    <div class="box_info_title pr20 tr"><i>*</i><span>公司名称</span></div>
                    <input type="text" class="box_input_info" name="companyName" ng-model="person.name" placeholder="请填写真实姓名" ng-maxlength="15" required zs-focus
                           ng-class="{error_input: resumeForm.companyName.$invalid && resumeForm.companyName.$dirty && !resumeForm.companyName.$focused}"/>
                    <span class="errMsg" ng-show="resumeForm.companyName.$dirty && resumeForm.companyName.$invalid && !resumeForm.companyName.$focused">
                        <span class="warning" ng-show="resumeForm.companyName.$error.required">必填</span>
                        <span class="warning" ng-show="resumeForm.companyName.$error.maxlength">请填写1-15位任意字符</span>
                    </span>
                </div>
                <div class="box">
                    <div class="box_info_title pr20 tr"><i>*</i><span>职位</span></div>
                    <input type="text" class="box_input_info" name="position" ng-model="person.position" placeholder="请填写真实姓名" ng-maxlength="15" required zs-focus
                           ng-class="{error_input: resumeForm.position.$invalid && resumeForm.position.$dirty && !resumeForm.position.$focused}"/>
                    <span class="errMsg" ng-show="resumeForm.position.$dirty && resumeForm.position.$invalid && !resumeForm.position.$focused">
                        <span class="warning" ng-show="resumeForm.position.$error.required">必填</span>
                        <span class="warning" ng-show="resumeForm.position.$error.maxlength">请填写1-15位任意字符</span>
                    </span>
                </div>
                <a ng-show="$index!=0" style="color:red;" ng-click="del($index)">移除</a>
            </div>
    

      js部分

     $scope.postList = [];
                $scope.del=function(idx){
                    $scope.postList.splice(idx,1);
                }
                $scope.addPost = function(){
                    var obj={id:101,position:'前端',name:"甲乙丙"};
                    $scope.postList.push(obj);
                    //老式添加方法
                    //var html =
                    //    '<div class="resumeInfo_box">' +
                    //    '<div><input type="text" class="zs_input" placeholder="填写工作经历"/></div>' +
                    //    '<div><input type="text" class="zs_input" placeholder="填写公司名字"/><span>{{$index}}</span></div>' +
                    //    '<div class="c_f46600" ng-click="delJt($index)">删除</div>' +
                    //    '</div>';
                    //var $html = $compile(html)($scope);
                    //angular.element(".resumeInfo_wrap").append($html);
                };
    

      

  • 相关阅读:
    【译】高级指南-深入JSX
    记一次MongoDB裸奔
    CORS详解
    如何用Node编写命令行工具
    JSONP详解
    Web API接口之Geolocation
    认识AMD、CMD、UMD、CommonJS
    javascript之反柯里化(uncurrying)
    webpack3.0之loader配置及编写(一)
    小程序图形验证码前端实现
  • 原文地址:https://www.cnblogs.com/vonson/p/9761407.html
Copyright © 2020-2023  润新知