Ion-icon not showing in my app

Ionic Framework ionic-v3
1

Hi all, in my app I try to use ion-icon in a list, item combination but it does not work and no icon appear with items. I tried to change icon for example from briefcase to home or something else but the problem still.
Here is the code:


<ion-icon name="briefcase"></ion-icon>

Now the question is that: it need to install any module to activate ion-icon or there are any special configuration for it (perhaps)?
Thanks in advanced

2

You need to post the HTML of your ion-item if you want specific help. In general though, your problem is probably that you’re missing the directive that places the icon in the ion-item (item-left, item-content, item-right).

3

Hi AaronSterling and thank you for reply. Here is my HTML for this view, it is very simple:

<ion-view view-title="{{properties.item.lastName}} - {{properties.item.firstName}}">
    <ion-nav-bar class="bar-positive">
        <ion-nav-back-button class="button-clear">
            <i class="ion-chevron-left"></i> Back
        </ion-nav-back-button>
    </ion-nav-bar>
    <ion-content>
        <ion-list>
            <ion-item ng-repeat="info in infos">
                {{info.firstName}} - {{info.lastName}}
                <ion-icon name="person"></ion-icon>
            </ion-item>
        </ion-list>
    </ion-content>
</ion-view>

I tried for another icons for test for example “home”, “call” but unfortunately those aren’t work.
In other piece of code use of icon does not works too:

<div ng-if="properties.infoType == 'jobs'">
	<button class="button button-block">{{properties.workName}}</button>
	<div class="item item-input-inset">
		<label class="item-input-wrapper">
			<input type="search" ng-model="properties.workAbbr" placeholder="جستجو برای انتخاب مشاغل">
		</label>
		<button class="button icon icon-right ion-briefcase button-small button-energized"
			ng-click="getWorks(properties.workAbbr)">فهرست مشاغل و اشخاص حقوقی</button>
	</div>
</div>

but when I change ion-briefcase to ion-home it works fine and I don’t know what is difference between these two icons. I think that, it is about icons are not installed correctly in my app.
Is it true? If yes how can I update icons for me. actually I’ve not installed any icon, only I start ionic with a standard command and begin to develop. Please help me to solve my issue.
Thanks in advanced.

4

Your icon is inside an ion-item. Anything inside an ion-item needs a directive that says where to place it inside the item. Look at the documentation for ion-item to see details. Also, what I wrote in my first post is what you need to do.

5

Hi AaronSterling, I added directive also to the ion-icon for three, four times, for example item-left, item-right, item-start, item-end but in all cases the results are identical and the icon don’t shows.