Ionic AngularJS: attach the image and text to the Ionic View Not Display header

advertisements

I have made a code to attach image and a text along side to the header bar of ionic view. This is the code snippet:

<ion-view align-title="left">
<h1 style="margin-left:100px" class="title">
<img class="title-image" src="http://www.ionicframework.com/img/ionic-logo-white.svg" width="123" height="43" />
</h1>
<h1 class="title">Titled Text</h1>
    <ion-content class="padding">
        <div class="list list-inset">
            <label style="border: 3px solid red; border-radius:5px;" class="item item-input">
                <input focus-on="focusMe" type="text" ng-model="register.username" placeholder="Choose username">
            </label>
            <label style="margin-top: 10px; border: 3px solid red; border-radius:5px;" class="item item-input">
                <input type="password" placeholder="Choose password" ng-model="register.password">
            </label>
        </div>
        <a style="margin-top: 100px; border: 3px solid red; border-radius:5px; background-color: #ff6000 class="button button-block button-positive">Next</a>
    </ion-content>
</ion-view>

This is the plunk that I have made.

Plunker

Please how can I make image and text appear to the header bar of ionic view?


I have made a small demo for you,

Plunker

HTML

<ion-view title="Home" hide-nav-bar="true">
    <div class="bar bar-header bar-light">
         <h4>myApp</h4>
        <div style="width:100%">
            <img style="height: 16px;
        margin-top: 9px;" src="https://placehold.it/85x25" />
        </div>
    </div>
    <ion-content padding="true">
        <h1 style="text-align: center;">Welcome user</h1>
    </ion-content>
</ion-view>