Show an input box according to select option and then display entered text

Question

I am trying to edit the messenger bot-builder. I need to add a new option in select "send url" and according to select option I want to show an input field and then I want to display live on page and access the text entered in input field.

I have written the code to add an option "send url" like this

<select ng-model="answersType[$index]" ng-change="activeAnswer = node.answers[$index] = {}">
<option value="text">Send Text</option>
<option value="image">Send Image</option>
<option value="video">Send Video</option>
<option value="audio">Send Audio</option>
<option value="file">Send File</option>
<option value="button">Send Buttons</option>
<option value="generic">Send Generic</option>
<option value="genericurl">Send Url</option>
<option value="list">Send List</option>
<option value="shortcode">Dynamic Shortcode</option>
<option value="command">Current Lead</option>

and added the code for showing input field

<div ng-show="answersType[$index] == 'genericurl'" class="form-group answer-properties">
<input class="form-control" ng-model="answer.genericurl" placeholder="http://" >

And for display text entered in input box

<script type="text/ng-template" id="/data-table.html">
<div ng-hide="node.answers.length == 1 && node.answers[0].text == '' && node.pattern == ''">
    <div ng-if="answer.text" class="answer-text">
            <p><span class="dashicons dashicons-admin-comments"></span> {{answer.text}}</p>
    </div>
    <div ng-if="answer.genericurl" class="answer-text">
            <p>{{answer.genericurl}}</p>
    </div>
</div>

If I select the "send text" from drop-down everything is working for me, but when I select "send url" it shows me input field but it doesn't show me text if I enter something.

And I also want to access the entered value in angular js app so how can I access it?

I tried it using ng-model but it didn't work for me.