आयनिक: बैक बटन में कस्टम आइकन - कैसे करें?

Question

हैलो मैं कोड निम्नलिखित है:

<ion-nav-buttons side="left"> 
    <button class="button button-icon icon ion-chevron-left" ng-click="goBack()" ></button> 
</ion-nav-buttons> 

कौन सा उत्पादन निम्नलिखित उत्पादन:

मैं कस्टम आइकन (48x48 पिक्सल) के लिए इस्तेमाल किया प्रतीक को बदलना चाहते हैं।

मैं इसे आयनिक में सही तरीके से कैसे कर सकता हूं? http://forum.ionicframework.com/t/how-to-use-custom-icons-with-tabs-0-9-26/1628

लेकिन बिना भाग्य:

मैं निम्न विषय में निर्देश का पालन करने की कोशिश की।

किसी भी सलाह के लिए बहुत धन्यवाद।

Answer 1

अपनी समस्या को हल करने के लिए आसान तरीका मौजूद है, यह सिर्फ अपने .js में डाल:

.my-back-button { 
content: url('http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/black-ink-grunge-stamps-textures-icons-arrows/003683-black-ink-grunge-stamp-textures-icon-arrows-double-arrowhead-left.png'); 
width: 35px; 
} 

:

$ionicConfigProvider.backButton.icon('my-back-button'); 

और अपने सीएसएस (कृपया $ ionicConfigProvider प्रलेखन here देखें)

आप इस उदाहरण को LINK

में चला सकते हैं

एक अन्य समाधान इस (केवल सीएसएस का उपयोग कर) हो सकता है:

<ion-nav-back-button class="button-clear"> 
    <i class="button button-icon my-back-button"></i> 
    </ion-nav-back-button> 

और अपने सीएसएस:

.my-back-button { 
content: url('http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/black-ink-grunge-stamps-textures-icons-arrows/003683-black-ink-grunge-stamp-textures-icon-arrows-double-arrowhead-left.png'); 
width: 48px; 
} 

इस उदाहरण here देखें।

नोट: किसी भी तरह से एक आयनिक ब्लॉग आइकन-फोंट का उपयोग करने का सुझाव देता है, लेकिन कुछ बिंदुओं पर मेरे बिंदु से यह समझ में नहीं आता है। कृपया यह link पढ़ें।

मुझे आशा है कि यह जानकारी आपके लिए उपयोगी होगी।

Answer 2

बस इसे करें! :)

वर्ग

<ion-nav-back-button class="button-clear ion-chevron-left"> 
</ion-nav-back-button> 

उपयोग = "" अपने कस्टम आइकन निर्धारित करने के लिए विशेषता .. इस मामले में, मैं आयन शेवरॉन-बाएँ का इस्तेमाल किया है (अपने उदाहरण की तरह बनना) ..!

लेकिन तुम भी डिफ़ॉल्ट पाठ को बदलना चाहते हैं .. आप इसे अलग कर सकते हैं:

<ion-nav-back-button class="button-clear"> 
    <i class="ion-chevron-left"></i> Back Text 
</ion-nav-back-button> 

रेफरी: http://ionicframework.com/docs/api/directive/ionNavBackButton/