Onsen UIとAngularJSを利用してピンチイン、ピンチアウトで
画像を拡大縮小する機能を作成中ですが、うまくいきません。
コードは下記のようにしています。
まずはピンチイン、ピンチアウトで画像の大きさを5倍となるようにしたいのですが、
ピンチイン、ピンチアウトではイベント自体は拾えていますが(alertを入れるとダイアログが表示される)、
CSSの書き換えがされません。
しかしながら、ng-ClickではCSSの書き換えが正常に行われ、タップすると画像の大きさが5倍になります。
下記のようなコードではピンチイン、ピンチアウトのcssの書き換えができないのでしょうか?
そもそもの考えて方が間違っているのでしょうか?
教えていただければ幸いです。
HTML
1 <ons-gesture-detector ng-click="resize()" ng-pinchin="resize()" ng-pinchout="resize()"> 2 <img ng-src="data:image/png;base64,{{Image}}" ng-style="imageStyle"/> 3 </ons-gesture-detector>
JavaScript
1$scope.resize = (magnification, $event) => { 2 width = 500; 3 $scope.imageStyle = { display: 'block', width: width + '%', height: 'auto' }; 4 };
あなたの回答
tips
プレビュー