lundi 13 juin 2016

bind ng-style from dynamic html

I have a problem with some dynamic data that it is stored in database. I am storing in database div with ng-style, and then when response is back from server with this div , will like to apply a style to this div.

If it is not dynamic, I have no problems. this is my code:

This my static html.

<div ng-controller="empty" >
    <div>
        <div ng-bind-html="validData | unsafe"/>
    </div>
</div>

this is comming from database.

<div class="row">   
    <div ng-style="visualization" class="col-md-4">.col-md-2</div>   
    <div ng-style="visualization" class="col-md-8">.col-md-8</div> 
</div> 
<div class="row">
    <div ng-style="visualization" class="col-md-4">.col-md-8</div>
</div>

and this should be my controller.

$http.get(globalVars + 'page/' + lastParam)
  .success(function (data) {
    $scope.empty = data;

    $scope.validData = $scope.empty.layout.schema;

    $compile($scope.validData);

    if(typeof $rootScope.mode == 'undefined' || $rootScope.mode    =='edit'){

       $scope.visualization = {
         "border-style": "dashed"
       }
    }
    else{
       $scope.visualization = {
         "border-style": "none"
    }
  }
  })
  .error(function (data) {
});

in theory, in each div from data coming from database should be added "style=border-style:none/dashed",but this not happening, so ng-style it is not binded to angular.

some help should be appreciated. thanks

Aucun commentaire:

Enregistrer un commentaire