angularjs apply方法

最新推荐文章于 2024-07-06 16:47:02 发布
最新推荐文章于 2024-07-06 16:47:02 发布
阅读量158 收藏
点赞数
分类专栏： angularjs 文章标签： javascript ViewUI 
不废话，直接上代码，请搜索 apply 为什需要在标准服务上掉呢。。。。


var app = angular.module('MyApp', ['ngResource','ngRoute','ngGrid']).config(function ($routeProvider) {
    $routeProvider
      .when('/store', {
        templateUrl: 'page/store.html',
        controller: ''
      })
      .when('/schema', {
        templateUrl: 'page/schema.html',
        controller: ''
      })
      .when('/storeinfo', {
        templateUrl: 'page/storeinfo.html',
        controller: ''
      })
  });

var spacename ='';

app.controller('storeManage', function ($scope) {  

  $scope.storeView = true;
  $scope.schemaView = false;    
  $scope.space = {name:"spaces",realname:""};
  $scope.spaces = spaceModel;

  $scope.$on("storeChange",
    function (event, treeNode) {
       $scope.storeView = true;
       $scope.schemaView = false;   
       $scope.$broadcast("storeChangeFromParent", treeNode);
    });

  $scope.$on("schemaChange",
    function(event,treeNode){
        $scope.storeView = false;
        $scope.schemaView = true;
        $scope.$broadcast("schemaChangeFromParent",treeNode);
    });

  $scope.selectSpace=function(){
    $("#spacemodal").modal();
  }

  $scope.saveSpace = function(){
    $scope.space = $scope.tempSpace; 
    spacename = $scope.space.name;
  }

  $scope.cancelSpace = function(){
    $scope.tempSpace = {};
  }

});

app.controller('storeTreeController', function ($scope) {

});

app.controller('storeEdit',function($scope,$http,storeInstance,setMetaInstance,smeDeploySet,smeCreateSet,spaceSchema,StatusesConstant){

    console.log("store controller init..........");

 	$scope.store = storeModel;	
 	$scope.indexInfo = indexModel;
 	$scope.set = setModel;
 	$scope.listElement = listElementModel;
 	$scope.spaceSchemaList = spaceSchemaListModel;
 	$scope.isBaseSchema = false;

   $scope.createStore = false;
   $scope.createSetMeta = false;
 

  $scope.firstShow = true;
  $scope.secondShow = false;

  console.log("show initial...............");

  $scope.title = "查看数据集";

  $scope.statuses = StatusesConstant;

 	$("#schematree").hide();
 	$("#storetree").show();

  $("#storePanel").show();
  $("#schemaPanel").hide();

  $scope.$on("storeChangeFromParent", function (event, treeNode) {
	 if(treeNode.isParent == true){

        $scope.title = "查看store";
        $scope.firstShow = true;
        $scope.secondShow = false;
        $("#storePanel").show();
        $("#schemaPanel").hide();



        $scope.store = createStoreModel();
        $scope.set = createSetModel();

        $scope.$apply(
          storeInstance.get({setName:treeNode.name}).$promise.then(
            function(resolve){
              $scope.store = resolve;

              if(typeof($scope.store.entitySetName) == "undefined"){
                  alert("获取store出错");
              }else{
                  setMetaInstance.get({setMetaName:treeNode.name}).$promise.then(
                        function(resolve){
                         $scope.set = resolve;
                          if(typeof($scope.set.setName)=="undefined"){
                               $scope.set = createSetModel();
                               $scope.set.setName = $scope.store.entitySetName;
                               $scope.createSetMeta = true;
                           }
                       },
                   function(reject){console.log("get SetMetadata failed"+reject)}
                  );
              }
            },
            function(reject){console.log("get store failed")}
          ));

        $scope.set.appSpaceId = $scope.space.realname;


        $(".store_info").each(function(){
            this.disabled = true;
        });
       }
    });

    $scope.createStore = function(){
        $scope.store = createStoreModel();
        $scope.set = createSetModel();

        $scope.store.appSpaceId = $scope.space.realname;
        $scope.store.entitySetName = $scope.space.realname+".";

        $("input,select,textarea").each(function(){
             this.disabled = false;
     });
        $scope.gridOptions.enableCellEdit = true;

        $scope.isCreate = true;

        $scope.firstShow = false;
        $scope.secondShow = true;

        $scope.title = "创建store";
    }

    $scope.cancelStore = function(){
       $scope.firstShow = true;
       $scope.secondShow = false;

       $(".store_info").each(function(){
          this.disabled = true;
       });
       $scope.title = "查看store";

    }

   $scope.createStoreTable = function(){
      smeDeploySet.deploy(
        {spaceName:$scope.space.realname},
        function(data){
            console.log("deploy success");  
        },
        function(){
          console.log("deploy failed");
        });
    }


    $scope.editStore = function(){
      if($scope.store.entitySetName == ''){
        alert("请先选择一个store");
        return;
      }

    	$(".ex_store_info").each(function(){
    		this.disabled = false;
    	});
      $scope.isCreate = false;
      $scope.firstShow = false;
      $scope.secondShow = true;
      $scope.title = "编辑store";



      $scope.firstShow = false;
      $scope.secondShow = true;

      $scope.gridOptions.enableCellEdit = true;
      if($scope.set.entitySchemaList.length ==0){
        $scope.createSetMeta = true;
      }
    };

	$scope.saveStore = function(){  

      $scope.set.setName = $scope.store.entitySetName;
      $scope.set.appSpaceId = $scope.space.realname;

    if($scope.isCreate == true){
      smeCreateSet.save({setName:$scope.store.entitySetName},$scope.store)
      if(typeof($scope.set.entitySchemaList)!="undefined" && $scope.set.entitySchemaList.length > 0){
          setMetaInstance.put({setMetaName:$scope.set.setName},$scope.set)
         }
    }
    else{
      storeInstance.save({setName:$scope.store.entitySetName},$scope.store);
      if(typeof($scope.set.entitySchemaList)!="undefined" && $scope.set.entitySchemaList.length > 0 ){

          if($scope.createSetMeta == true){
           setMetaInstance.put({setMetaName:$scope.set.setName},$scope.set);
           $scope.createSetMeta = false;
          }else
           setMetaInstance.save({setMetaName:$scope.set.setName},$scope.set);
      }
    } 

     $scope.firstShow = true;
     $scope.secondShow = false;

     $scope.createSetMeta = false;

    $(".store_info").each(function(){
        this.disabled = true;
    });

    $scope.title = "查看数据集";
	}

	$scope.createIndex = function(){
		$("#input_index").show();
	}

	$scope.quitIndex = function(){	
		$scope.indexInfo = '';
		$("#input_index").hide();
	}

	$scope.confirmIndex = function(){
		$scope.store.index.push($scope.indexInfo);
		$scope.indexInfo = null;
		$("#input_index").hide();
	}

	$scope.delIndex = function(index){
      $scope.store.index.splice(index,1);
    };

    $scope.createSchema = function(){
    	$("#input_schema").show();

    	var URL = "/MDE/DSE/EntitySchema?$filter=appSpace eq \'"+$scope.space.realname+"\'";
    	$http({
    		url:URL,
    		method:"GET"
    	}).success(function(data){
    		$scope.spaceSchemaList = data;
    	});
    }

    $scope.confirmSchema = function(){
    	var flag = true;
    	var tempList = $scope.set.entitySchemaList;
    	

      if(tempList.length > 1){
          for(var i=0;i<tempList.length;i++){
            if(tempList[i].schemaName == $scope.schemaName){
                flag = false;
                alert("schema already exist");
          }
        }
      }
    	
    	
    	if(flag==true){	


        if($scope.isBaseSchema == "true"){
           $scope.isBaseSchema = true;
        }else{
          $scope.isBaseSchema = false;
        }
    		$scope.set.entitySchemaList.push({
    			id: $scope.set.entitySchemaList.length+1,
    			schemaName : $scope.schemaName,
    			isBaseSchema:$scope.isBaseSchema
    		 }
    		);
	    	$("#input_schema").hide();  	
    	}
    	
    }

    $scope.quitSchema = function(){
    	$scope.listElement = null;
    	$("#input_schema").hide();
    }

    $scope.delSchema = function(index){
    	 $scope.set.entitySchemaList.splice(index,1);
    }

    $scope.pkeyTypes =dataTypeModel;
    $scope.storeTypes=storeTypeModel;

    $scope.markTypes = markTypeModel;
    $scope.indexTypes = dataTypeModel;

//    $scope.testData=[{col1:"fuck1",col2:"fuck2",col3:2,col4:"fuck4",col5:"fuck5"},
//                     {col1:"fuck12",col2:"fuck22",col3:1,col4:"fuck24",col5:"fuck25"}];

    $scope.editDFV = function(){
      console.log("edit dfv");
    }

    $scope.deleteDFV = function(row){
       $scope.store.defaultValues.remove(row.rowIndex);
    }



    $scope.selectCell ="<select ng-model='COL_FIELD' ng-class='\'colt\' + col.index'   ng-input='COL_FIELD' ng-options='id as name for (id, name) in statuses' ng-blur='updateEntity(row)'></select>";
    $scope.buttonCell = '<button  class="btn btn-link" ng-click="deleteDFV(row)" ng-show="secondShow">删除</button>';
    $scope.gridOptions = {
        data: 'store.defaultValues',
        enableCellEdit: true,
        columnDefs: [{field: "name",displayName:"名称"},
                     {field:"dType",displayName:"类型", editableCellTemplate: $scope.selectCell ,cellFilter: 'mapStatus'},
                     {field:"defaultValue",displayName:"默认值"},
                     {field:"evalExp",displayName:"表达式"},
                     {displayName:"操作",cellTemplate:$scope.buttonCell, enableCellEdit: false}
           ]
    };

    $scope.createDefaultValue = function(){
//         if(isNaN($scope.store.defaultValues))
         $scope.store.defaultValues.unshift({name:null,dType:1,defaultValue:null,evalExp:null});

    }

    $scope.updateEntity = function(row) {
       console.log("row",row);

     };

     $scope.displayDefaultValue= function(row){
         console.log($scope.store.defaultValues);
     }
});

app.directive('ngBlur', function () {
      return function (scope, elem, attrs) {
        elem.bind('blur', function () {
          scope.$apply(attrs.ngBlur);
        });
      };
    });

app.filter('mapStatus', function( StatusesConstant ) {
     return function(input) {
       if (StatusesConstant[input]) {
         return StatusesConstant[input];
       } else {
         return 'unknown';
       }
     };
   })

app.factory( 'StatusesConstant', function() {
      return {
        1: 'preset',
        2: 'evaljs'
      };
    });


Array.prototype.remove=function(dx)
{
    if(isNaN(dx)||dx>this.length){return false;}
    for(var i=0,n=0;i<this.length;i++)
    {
        if(this[i]!=this[dx])
        {
            this[n++]=this[i]
        }
    }
    this.length-=1
}


app.factory('storeInstance',['$http','$resource',function($http,$resource){
	return $resource('/MDE/DSE/EntitySet(\':setName\')',
					  {setName:'@setName'},
					  {create:{method:'PUT'},params:{},isArray:false}
					) ;
}]);


app.factory('setMetaInstance',function($http,$resource){
	return $resource(
					  '/MDE/DSE/SetMetadata(\':setMetaName\')',
					  {setMetaName:'@setMetaName'},
	  				  { put:{method:"PUT"}, params:{},isArray: false}
	  				 )
});

 

 

html

 

	
     <div class="row">
         <div class="col-md-3">
		      <div class="zTreeDemoBackground left" ng-controller="storeTreeController">
		         <ul storetree id="treeDemo" class="ztree" showIcon="showIconForTree"></ul>
	          </div>
		 </div>

		
			<div ng-controller="storeEdit"  id="storePanel" ng-show="storeView">
				 <div class="col-md-6">
				 	<h4>{{title}}</h4>
				 	<div  class="panel panel-info" >
						<div class="panel-heading ">
			                  数据集管理 			  
						     <button type="button" class="btn btn-primary btn-sm" ng-click="createStore()" ng-show="firstShow">新增</button>	
						     <button type="button" class="btn btn-primary btn-sm" ng-click="editStore()" ng-show="firstShow" >修改</button>	
						    
						     <button type="button" class="btn btn-primary btn-sm" ng-click="saveStore()" ng-show="secondShow">保存</button>
						     <button type="button" class="btn btn-primary btn-sm" ng-click="cancelStore()" ng-show="secondShow" >取消</button>	   
						     <button type="button" class="btn btn-primary btn-sm"   ng-click="createStoreTable()" ng-show="firstShow">发布</button>

						    	  
						</div>

					    <div class="panel-body">	
					       <div class="panel panel-info">
							   <div class="panel-heading">
									  数据集基础信息
									
									 				  
								</div>
				          
						    
							   <div class="form-horizontal panel-body "    style="padding-top: 40px;">

							    <div class="form-group " role="form" >
									<label  class="col-md-2 control-label">数据集名称</label>
									<div class=" col-md-4">
									  
									  <input type="text" class="form-control store_info"  ng-model="store.entitySetName">
									</div>

									<label  class="col-md-2 control-label">AppSpaceId</label>
									<div class="col-md-4">
									  <input type="text" class="form-control store_info"  ng-model="store.appSpaceId">
									</div>
							    </div>		
							  
							   		 	
								
								 <div class="form-group">
								 	<label  class="col-md-2 control-label">主键</label>
									<div class="col-md-4">
									  <input type="text" class="form-control store_info ex_store_info"  ng-model="store.pKey">
									</div>


									<label  class="col-md-2 control-label">主键类型</label>
									<div class="col-md-4">
									       <select ng-model="store.pkeyType" ng-options="o.id as o.name  for o in pkeyTypes" class="form-control store_info ex_store_info">
						  						<option >-- 请选择 --</option>
						  					</select>
									</div>

								
							    </div>		
							  
							   
								  <div class="form-group">
									<label  class="col-md-2 control-label">存储类型</label>
									<div class="col-md-4">
									       <select ng-model="store._storageType" ng-options="o.id as o.name  for o in storeTypes" class="form-control store_info ex_store_info">
						  						<option >-- 请选择 --</option>
						  					</select>
									</div>
							    </div>	
								
								 <div class="form-group">
									<label  class="col-md-2 control-label">描述</label>
									<div class="col-md-4">
									  <textarea class="form-control store_info ex_store_info"   ng-model="store.description"></textarea>
									</div>
							    </div>	
						 </div> 

		         
						      <div class="panel panel-info"  style="padding-top: 20px;">
						      	   <div class="panel-heading">	
										 索引信息							 
										 <button type="button" class="btn btn-primary btn-sm" ng-click="createIndex()" ng-show="secondShow">新增索引</button>
									 
									</div><!-- panel-heading-->




								  <div class="panel-body"  >
								  	<table class="table display_table" >
								  		<col width="8%" />
				  						<col width="15%" />
							            <col width="10%" />
							            <col width="15%" />
							            <col width="20%" />
							            <col width="20%" />
							            <col width="15%" />

								  		<thead>
								  			<tr>
								  				<td>编号</td>
								  				<td>索引名称</td>
								  				<td>直接索引</td>
								  				<td>markType</td>
								  				<td>索引类型</td>
								  				<td>表达式</td>
								  				<td>&nbsp&nbsp&nbsp</td>
								  			</tr>
								  		</thead>
								  		<tbody>
								  			<tr id="input_index" style="display:none">
								  				<td>									  				  
								  				</td>
								  				<td ><div><input type="text" ng-model="indexInfo.path" ></input></div></td>

								  				<td ><div><input type="text" ng-model="indexInfo.direct" ></input></div></td>

								  				
								  				<td ><select ng-model="indexInfo.markType " ng-options="o.id as o.name  for o in markTypes"  >
						  						    <option ></option>
						  					        </select>
						  					    </td>
								  				<td > 
								  					<select ng-model="indexInfo.indexDataType" class="selectdatatype" ng-options="o.id as o.name  for o in indexTypes" >
						  						    <option ></option>
						  					        </select>
						  				        </td>


								  				<td ><input type="text" ng-model="indexInfo.expression" ></input></td>
								  				<td ><button type="button" class="btn btn-primary btn-sm"  
								  					  ng-click=" confirmIndex()">确认</button>
								  					<button type="button" class="btn btn-primary btn-sm" 
								  					  ng-click="quitIndex()">取消</button>
								  				</td>
								  			</tr>
								  			<tr ng-repeat="o in store.index">
								  				<td>{{$index+1}}</td>
								  				<td>{{o.path}}</td>
								  				<td>{{o.direct}}</td>
								  				<td ><select ng-model="o.markType" ng-options="o.id as o.name  for o in markTypes"  disabled="disabled">
						  						    <option ></option>
						  					        </select>
						  					    </td>
								  				<td > 
								  					<select ng-model="o.indexDataType"  class="selectdatatype"  ng-options="o.id as o.name  for o in indexTypes" disabled="disabled">
						  						    <option ></option>
						  					        </select>
						  				        </td>

								  			  
								  				<td>{{o.expression}}</td>
								  				<td>	
								  					<button type="button" class="btn btn-link btn-sm"  ng-show="secondShow" ng-click="delIndex($index)">删除</button>
								  				</td>	
								  			</tr>
								  		</tbody>
								    </table> 	
								  </div><!-- /.panel-body-->



							 </div><!--panel-->

                             <div class="panel panel-info" style="padding-top: 20px;" >
                                 <div class="panel-heading">
                                     默认值信息
                                     <button type="button" class="btn btn-primary btn-sm" ng-click="createDefaultValue()" ng-show="secondShow">新增默认值</button>

                                 </div>
                                 <div>


                                 </div>
                                 <div class="panel-body">
                                     <div class="gridStyle" ng-grid="gridOptions"></div>
                                 </div>

                             </div>
		              
						     </div>
					    </div>
				    </div><!--mid-panel-->
				  </div> <!--col-md-6-->
					
  				<div class="col-md-3"  ng-show="storeView">
				    <div class="panel panel-info"  >
		  				<div class="panel-heading">
		  					所含Schema
		  					 <button type="button" class="btn btn-primary btn-sm" ng-click="createSchema()" ng-show="secondShow">添加Schema</button>		
		  				</div>
		  				<div class="panel-body">
		  					<table class="table display_table">
		  						<col width="10%" />
		  						<col width="50%" />
					            <col width="20%" />
					            <col width="20%" />

						  		<thead>
						  			<tr>	
						  			    <td>&nbsp</td>			
						  				<td>schema名称</td>	
						  				<td>baseSchema</td>
						  				<td>&nbsp&nbsp&nbsp</td>		  				
						  			</tr>
						  		</thead>
						  		
						  			<tr id="input_schema" style="display:none">
						  				<td></td>
						  				<td >
						  					<select class="selectdatatype" ng-model="schemaName" >
						  						<option ng-repeat = "o in spaceSchemaList">{{o.id}}</option>
						  					</select>

						  				</td>
						  				<td>
						  					<select ng-model="isBaseSchema">
						  						<option  value="true">是</option>
						  						<option  value="false">否</option>
						  					</select>


						  				</td>
						  				<td ><button type="button" class="btn btn-link"  
						  					  ng-click=" confirmSchema()">确认</button>
						  					<button type="button" class="btn btn-link" 
						  					  ng-click="quitSchema()">取消</button>
						  				</td>
								  	</tr>
						  			<tr ng-repeat="o in set.entitySchemaList">	
						  				<td>{{$index+1}}</td>
						  				<td>{{o.schemaName}}</td>	
						  				<td>{{o.isBaseSchema}}</td>
						  				<td>
						  					<button type="button" class="btn btn-link"  ng-click="delSchema($index)" ng-show="secondShow">删除</button>
						  				</td>	  				
						  			</tr>
						  		
						    </table>

		  				</div>
				    </div>
				 </div><!--right-bar-->
			</div>	

			
			<div  ng-controller="schemaEdit" id = "schemaPanel" ng-show="schemaView" >
				
				



				<div class="col-md-8">
					<div class="panel panel-info">
						<div class="panel-heading">
							实体元数据
						
							
						</div>
						<div class="panel-body">
							<div class="panel panel-info">
								<div class="panel-heading">
									基本信息
								</div>

								<div class="panel-body">
									
									 <div class="form-horizontal panel-body"    style="padding-top: 40px;">
									    <div class="form-group" >
											<label  class="col-md-2 control-label">id</label>
											<div class="col-md-4">
											  <input type="text" class="form-control schema_info"  ng-model="schema.id">
											</div>

											<label  class="col-md-2 control-label">AppSpaceId</label>
											<div class="col-md-4">
											  <input type="text" class="form-control schema_info"  ng-model="schema.appSpaceId">
											</div>
										    </div><!--form-group-->		
								  
								   		 	
									
											 <div class="form-group">
												<label  class="col-md-2 control-label">实体集名称</label>
												<div class="col-md-4">
												  <input type="text" class="form-control schema_info"  ng-model="schema.entitySetName">
												</div>

												<label  class="col-md-2 control-label">对象名</label>
												<div class="col-md-4">
												  <input type="text" class="form-control schema_info"  ng-model="schema.entityName">
												</div>
										    </div><!--form-group-->		
								  
								   
											 <div class="form-group">
												<label  class="col-md-2 control-label">版本</label>
												<div class="col-md-4">
												  <input type="text" class="form-control schema_info"  ng-model="schema.version">
												</div>
										    </div><!--form-group-->	
									
											 <div class="form-group">
												<label  class="col-md-2 control-label">描述</label>
												<div class="col-md-4">
												  <textarea class="form-control schema_info"   ng-model="schema.description"></textarea>
												</div>
										    </div><!--form-group-->	
							 		  </div><!--form--> 	
							    </div><!--panel body-->

						    <div class="panel panel-info">
								<div class="panel-heading">
									详细信息
									
								</div>
								<div class="panel-body">
									
									<table class="table schema_table">		
				  						<col width="20%" />
							            <col width="15%" />
							            <col width="20%" />
							            <col width="20%" />
							            <col width="10%"/>
							            <col width="15%"/>

							  		<thead>
							  			<tr>	 
							  				<td>名称</td>	
							  				<td>pType</td>
							  				<td>复杂类型</td>
							  				<td>校验规则</td> 
							  				<td>是否array</td> 
							  				<td>&nbsp&nbsp</td> 				
							  			</tr>
							  		</thead>
							  		
							  		<tbody>	
							  			<tr id="input_property" ng-show='propertyShow'>								  			
								  				<td ><input type="text" ng-model="property.name" ></input></td>
								  				<td ><input type="text" ng-model="property.pType" ></input></td>
								  				<td ><input type="text" ng-model="property.complexTypeName" ></input></td>
								  				<td ><input type="text" ng-model="property.verificationRegEx" ></input></td>
								  				
								  		</tr>

							  			<tr ng-repeat="o in schema.properties">						  										  				
							  				<td>{{o.name}}</td>	
							  				<td><select ng-model="o.pType" ng-options="o.id as o.name  for o in propertiesType"  disabled="disabled">
						  						    <option ></option>
						  					        </select></td>
							  				<td>{{o.complexTypeName}}</td>
							  				<td>{{o.verificationRegEx}}</td>
							  				<td>{{o.isArray}}</td>
							  				<td>						  					

							  				</td>	  				
							  			</tr>
							  		</tbody>
							    </table>



								</div>
								
							</div>

						</div>
						
					</div>
				</div>

			</div>		  
			
		
     </div>

 

furioustidy
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
AngularJS中$apply方法和$watch方法用法总结
10-20
AngularJS的$apply方法用于将非AngularJS环境中的代码变化同步到AngularJS的数据模型中。它确保在模型变化后，视图会得到相应的更新。 **使用场景**： 1. 当外部库（如jQuery）或DOM事件处理函数修改了模型数据时。...
Angularjs的$apply及其优化使用
weixin_34082789的博客
07-01 176
今天，我们要聊得是Angularjs中的小明星$apply。当我们数据更新了，但是view层却没反应时，总能听到有人说，用apply吧，然后，懵懂无知的我们，在赋值代码后面加了$scope.$apply(),然后就惊喜的发现。噢，真的更新了。 然而，有些时候，编译器会无情的给你返回 Error: $digest already in progress 那...
AngularJS中的$apply方法
weixin_34403693的博客
06-04 107
现在我想在页面上显示一个变量i，i的初始值是0，我希望通过controller每1秒给i加1，使得在页面上i从0，1，2，3，4……一直增长，我会这么做：<scripttype="text/javascript"> /** *Module * *Description */ angular.modu...
angularJS之$apply()方法
doushen1的专栏
02-25 858
这几天，根据buddy指定的任务，要分享一点angular JS的东西。对于一个在前端属于纯新手的我来说，Javascript都还是一知半解，要想直接上手angular JS，遇到的阻力还真是不少。不过我相信，只要下功夫，即使是反人类的设计也不是什么大的问题。      Okay，废话不多说。为了弄明白angular JS为何物，我先是从Scope开始。那么什么是Scope呢？借用官方文档的一段
angularJS中$apply()方法详解
lvjianyu2007的专栏
09-07 959
http://www.jb51.net/article/59538.htm 这篇文章主要介绍了angularJS中$apply()方法详解,需要的朋友可以参考下 对于一个在前端属于纯新手的我来说，Javascript都还是一知半解，要想直接上手angular JS，遇到的阻力还真是不少。不过我相信，只要下功夫，即使是反人类的设计也不是什么大的问题。      Ok
理解Angular中的$apply()以及$digest()
weixin_30299539的博客
03-31 263
$apply()和$digest()在AngularJS中是两个核心概念，但是有时候它们又让人困惑。而为了了解AngularJS的工作方式，首先需要了解$apply()和$digest()是如何工作的。这篇文章旨在解释$apply()和$digest()是什么，以及在日常的编码中如何应用它们。 探索$apply()和$digest() AngularJS提...
AngularJS报错$apply already in progress的解决方法分析
10-20
主要介绍了AngularJS报错$apply already in progress的解决方法,较为详细的分析了报错$apply already in progress的原理、处理技巧与相关注意事项,需要的朋友可以参考下
angularJS $scope的$apply方法实现model刷新
xuanwuziyou的专栏
10-12 5581
控制器内，$scope有个$apply方法，可以代码更改model并同步更新页面。通常，控制器内的方法执行完毕后仅会自动刷新一次页面展示，使用$apply方法即可在想刷新页面时就刷新。如本例，这个方法接收function类型的参数。 Title {{ date }} {{ count }}
angularJS学习小结——$apply方法和$watch方法
热门推荐
Jack 架构师之路
05-09 1万+
引言    最近在项目中封装控件的时候用到了$watch方法来监听module中的值的变化，当时小编对这个方法不是很了 解，所以在网上找了一些资料来学习一下，下面小编就给大家简单介绍一些angularJS中Scope 提供$apply 方法传播 Model 的变化和$watch方法监听module变化。    $apply使用情景   Angula
AngularJS $apply, $digest, 和$evalAsync
书香水墨
07-27 431
一、AngularJS $apply, $digest, 和$evalAsync的比较 1.1 $apply() $apply()会触发整个应用中的所有scope上的$digset循环。意思就是，每次我们调用$apply()都会在整个应用的生命周期中开启一个新的$digset循环。整个生命周期涉及3个主要任务: 表达式使用$eval（）方法执行。 执行表达式时出现的任何异常都将转发给$exce...
AngularJS 通知angular(视图)进行数据更新($scope.$apply())
houyanhua1的专栏
05-08 4059
demo.html： Document {{time}} {{time2}} var App = angular.module('App',[]); App.controller("DemoController",['$scope','$interval',function($scope,$inte
angularJS报错$apply already in progress
Inuyasha1121的专栏
04-05 1810
如果我们使用了angularJS中的$scope.$apply()或者$scope.$digest()，我们很可能会遇到类似下面的错误：Error: [$rootScope:inprog] $apply already in progress http://errors.angularjs.org/1.3.13/$rootScope/inprog?p0=%24apply at an...
Angularjs $scope 里面的$apply方法
Inuyasha1121的专栏
04-07 1694
$apply 方法作用：Scope 提供$apply 方法传播 Model 的变化$apply 方法使用情景：AngularJS 外部的控制器（DOM 事件、外部的回调函数如 jQuery UI 空间等）调用了 AngularJS 函数之后，必须调用$apply。在这种情况下，你需要命令 AngularJS 刷新自已（模型、视图等），$apply 就是用来做这件事情的。$apply 方法注意事项：...
angularJS中$scope.apply()的作用——什么时候手动调用$scope.apply()
司与
05-27 2795
每个接触angualrJS的前端工程师都会遇到这样一个问题，为什么model数据改变了，但是view也就是页面上却没有变化，比如发现设置了颜色，可是颜色没有变，设置了值改变，可是也没变，但是console.log()能看到数据已经改变了。 然后其他人就会说那就加上$scope.apply()吧，然后你就会很神奇地发现，页面上按照想要的样子改变了。 那么$scope.apply()究竟是做了什么...
【AngularJS】4.AngularJS $scope里面的$apply方法和$watch方法
返璞归真
03-28 971
1. Angularjs $scope 里面的$apply 方法 (1)$apply 方法作用： Scope 提供$apply 方法传播 Model 的变化 。 (2)$apply 方法使用情景： AngularJS 外部的控制器（DOM 事件、外部的回调函数如 jQuery UI 空间等）调用了 AngularJS 函数之 后，必须调用$apply。在这种情况下，你需要命令 AngularJ
Vue前端打包
weixin_63680330的博客
07-04 242
介绍:Nginx是一款轻量级的Web服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器。其特点是占有内存少，并发能力强，在各大型互联网公司都有非常广泛的使用。启动：双击nginx.exe 文件启动，服务器默认占用80端口。官网:https://nginx.org/打包好的dist目录赋值到html下。html静态资源文件目录。conf 配置文件目录。logs日志文件目录。temp临时文件目录。
Vue 3集成krpano 全景图展示
最新发布
Mr丶GUO
07-06 287
Vue 3集成krpano 全景图展示，需要借助官方工具进行制作注意事项：vue@cli3没有static，需要放在public目录下。
JS混淆基本类型和原理
朴拙科技的博客
07-06 411
混淆技术为JS代码提供了一定程度的保护，但同时也给代码的维护和逆向工程带来了挑战。了解和掌握这些混淆技术的原理和解析方法，可以帮助开发者更好地保护或理解JS代码。然而，需要注意的是，混淆并不是万无一失的安全措施，它更多的是增加了攻击者理解代码的难度。在进行逆向工程时，应始终遵守法律法规，尊重知识产权，不要用于非法目的。
apply方法
05-30
apply方法通常是指在JavaScript中的函数调用方式之一。apply方法可以改变函数的执行上下文，并且可以传递任意数量的参数。apply方法的第一个参数是要改变上下文的对象，第二个参数是一个数组，其中包含要传递给函数...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值