サービスからのデータを使用してディレクティブをロードする方法

以下は私のコードです。データをキャンバスを描画するための指示にすることはできません。私はキャンバス上のテキストエリアからテキストを更新したい。 htmlコード：サービスからのデータを使用してディレクティブをロードする方法

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

出典

2016-04-29 Sahi Thya

あなたはNG-変更作業罰金よろしいですか？ – hubert

あなたはこのコードを試し、サービスやコントローラーを作成する必要はありません。

 <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>

直接あなたのディレクティブであなたのテキストエリアのcontenuを注入。

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); 

    } 
} 
});

とあなたのコントローラで

：

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

出典

2016-04-29 23:49:25 hubert

私は同意しますが、おそらく彼は他の目的のためのサービスも持っています。ディレクティブにサービスを注入することは問題であってはなりません。 –

@hubertあなたの答えをありがとう。私は角度を覚えており、それを練習するためにサービスを使いたいと思っていましたが、他の目的にも使いたいです。 –

あなたの例を変えて、サービスが必要な場所を使いましょう。 – hubert

サービスからのデータを使用してディレクティブをロードする方法

答えて

関連する問題