Cách sử dụng hình ảnh làm nút trong ionic

Question

Mục tiêu của tôi là sử dụng hình ảnh làm nút trong ion. Lần đầu tiên tôi sử dụng thẻ để liên kết giữa trang. Nhưng khi tôi nhấp vào hình ảnh. Không có hiệu ứng kích hoạt nút nào. Vì vậy, tôi chuyển sang nút-tag

Tôi đã cố gắng sử dụng

<button class="button button-clear" style="background-image:url('img/myImage.jpg'); background-size:cover"></button> 

Nhưng chiều cao nút giữ nguyên. Vì vậy, nó sẽ không hiển thị hình ảnh kích thước đầy đủ. Tôi đã thử

style="font-size:100px;" 

và

style="line-height:100px;" 

Nhưng không có gì có vẻ làm việc.

Tôi cũng đã cố gắng thêm css riêng tôi

.Test-up { 
    border :none; 
    padding : 0px; 
} 

.Test-down { 
    opacity: 0.5; 
    border:0px; 
    padding: 0px; 
} 

và thêm vào bên dưới mã vào index.html của tôi

<button ng-mousedown="class='Test-down'" ng-mouseup="class='Test-up'" class="{{class}}" href="#"> 

và dưới mã để điều khiển của tôi

$scope.class = "Test-up"; 

như tôi đã cố gắng từ http://codepen.io/Leiron/pen/ztawA Nhưng nó không hoạt động với ios hoặc android. Vậy tôi nên làm gì đây?

Answer 1

hãy thử điều này.

<img src="img/myImage.jpg" style="width : 100% ; height : 100%" ng-click="nextpage()" > 

Điều này khiến bạn có thể có chiều cao và chiều rộng như mong muốn.

Đảm bảo bạn cung cấp đúng đường dẫn đến trường src.

Answer 2

việc kiểm tra này

<button ng-mousedown="class='fb-down'" ng-mouseup="class='fb-up'" class="{{class}}"> <img src="your_image_path" alt="" title="" /> </button>

Nếu bạn vẫn gặp phải bất kỳ vấn đề trong css và trong anyhting cho tôi biết.

Cảm ơn

Answer 3

Xem bút @http://codepen.io/jeggu96/pen/NRaxj Hy vọng nó sẽ giúp :) <button ion-button clear (click)="nextPage()"><img src="image path" alt=" " /></button>

Answer 4

Ionic 2

Nơi biểu tượng của bạn trong www/tài sản/images rồi

<img src="assets/images/icon.png" style="width : 100% ; height : 100%" ng-click="nextpage()" > 

Answer 5

Bạn có thể thử cách này -

<button (click)="click()" block> 
    <img src="assets/img/scan_btn.png"> 
</button>