updating angular model with bootstrap carousel

i'm working on an angular web app and i'm stuck in a part of it.i'm trying to update an angular model by choosing an item in a bootstrap carousel.i mean that if i select an image from the bootstrap carousel, the image's link will be put in the form used to update the model.is it possible to do it?this is the code i'm trying to make working

<link href="http://ift.tt/1fdChjM" rel="stylesheet"/>
<script src="http://ift.tt/1MghQHH"></script>
<script src="http://ift.tt/1mQ03rn"></script>
<div ng-controller="Interaction_Ctrl">
    <form>
        <table>
        <tr>
            <td>Image URL:</td>
            <td>
                <input type="url" placeholder="http://ift.tt/1Osi79E" ng-model="person.image" ng-change='change()' class="form-control" />
            </td>
        </tr>
        <tr>
            <td>
                <carousel>
                    <slide ng-repeat="slide  in slides" active="slide.active" ng-model="person.image" ng-change='change()'>
                        <img ng-src="{{slide.image}}" style="height:100px; margin:auto">
                        <div class="carousel-caption">
                             <h4>Slide {{$index}}</h4>

                            <p>{{slide.text}}</p>
                    </slide >
                </carousel>
            </td>
        </tr>
        </table>
    </form>
    </div>

var mymodule = angular.module("jsonerator", ['ui.bootstrap']);


mymodule.controller("Interaction_Ctrl", function ($scope) {
    $scope.slides = [];
    $scope.slides.push({
        text: 'barnowl',
        image: 'http://ift.tt/1Osi79E'
    });
    $scope.slides.push({
        text: 'barnacles',
        image: 'http://ift.tt/1MghTmQ'
    });
    $scope.slides.push({
        text: 'barterer',
        image: 'http://ift.tt/1Osi5Pa'
    });
    $scope.slides.push({
        text: 'chickadee',
        image: 'http://ift.tt/1MghTmS'
    });
    $scope.slides.push({
        text: 'starling',
        image: 'http://ift.tt/1Osi79G'
    });

});