angularjs - デュアルバインディングをブートストラップ日時ピッカーで正しく動作させるにはどうすればよいですか?

Question

背景として、ブートストラップ日時ピッカーとともにangularを使用しています

私の問題は、私のAngularバインディングが一方向では機能しているようですが、他の方向では機能していないようです。まず、関連するサンプル コードをいくつか示します。

html

<!-- all of this falls under the scope of the angular controller I will show below -->

<!-- the actual date time picker -->
<div class="form-group">
    <label for="datetimepicker1"> Start </label>
    <div class='input-group date' id='datetimepicker1'>
        <input type='text' class="form-control" ng-model="start"/>
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
        </span>
    </div>
</div>

<!-- initializes the datetime picker using Jquery I am assuming -->
<script type="text/javascript">
    $(function () {
        $('#datetimepicker1').datetimepicker();
    });
</script>

<!-- submit button -->
<div class= "form-group form-group-sm">
    <button class= "btn btn-primary" ng-click= "submit">
        Submit
    </button>
</div>

JavaScript

// inside my relevant angular controller
alert('this works');  // this fires, so I know at least this much is hooked up

$scope.start = moment.subtract(7, 'days').toDate();

$scope.submit = function() {
    alert($scope.start);
}

関連するコードを示したので、ここに私の問題があります。アプリを起動すると、コントローラ コードが実行されると、DOM の日時ピッカーの入力フィールドが期待どおりに入力されます。$scope.start の適切な値を取り、すべてが素晴らしいです。

ただし、バインドは反対方向には機能しないようです。たとえば、日付を変更して [送信] ボタンをクリックすると、アラートがポップアップ表示されますが、$scope.start の以前の値が表示されます。

DOM のフィールドを変更しても ng-model (または角度用語が何であれ) は変更されないようです。

あるレベルでは、これは理にかなっています。何らかの形で別のコントローラーが動作していると思われます... ng-model は親スコープから $scope.start を継承しますが、変更しようとすると、変更が親スコープに反映されませんか?

ただし、このようなことを行うためのコントローラーを作成したことがないため、少し困惑しています。

フォローアップの質問に答えたり、追加のコードを投稿したりできれば幸いですが、これが私の問題を提示できる最もわかりやすいものだと思いました.

私のスコーピングの問題について誰か助けてください。この種の問題はangularで時々出てくるような気がするので、説明も大歓迎です。

ありがとう