Sahi Thya
Sahi Thya

Reputation: 1

how to load my directive with data from service

Below is my code and I can't get the data into directive to draw canvas. I want to update the text from textarea on canvas. html code:

<body ng-app="myApp" ng-controller="textCtrl">

Upvotes: 0

Views: 92

Answers (1)

hubert
hubert

Reputation: 3157

You don't need to create service and controller, try this code:

        <div class="container">
            <textarea ng-model="data">

            </textarea>

        </div>

    <canvas id="myCanvas" txt-img txt-data="data" width="200" height="100" style="border:1px solid #7d0f8b;"></canvas>



    <script src="app.js"></script>
</body>

directly inject the contenu of your textarea in your directive.

app.directive('txtImg', function(){
return {
    restrict: 'AEC',

    scope:{
       data:"=txt-data"
    },
    link: function(scope, el, attr){
        var c = el[0];
        var ctx = c.getContext("2d");
        ctx.font = "15px Arial";
        ctx.fillText(scope.data,20,20);

    }
}
});

and in your controller:

app.controller('textCtrl', function($scope){
  $scope.data = "";
});

Upvotes: 1

Related Questions