角度のある時計がUIを更新しない

Question

私は自分のモデルを更新中の時計を持っています。しかし、私のモデルは、UIのバインドされたコントロールを更新できません。

更新されたモデルのスクリーンショットです。

私のUIは、この

<form method="post" action="" role="form" class="form-horizontal form-group-sm"> 

    <table ng-controller="myController" class="table table-responsive table-striped"> 
     <tr> 
      <td> 
       <label for="moduleid" class="col-md-2">Module ID : </label> 
       <div class="form-group col-md-3"> 

        <input type="text" id="moduleid" name="moduleid" ng-model="hdr.moduleid" value="" class="form-control"> 
       </div> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <label for="modulename" class="col-md-2">Module Name : </label> 
       <div class="form-group col-md-4"> 
        <input type="text" id="modulename" name="modulename" ng-model="hdr.modulename" value="" class="form-control"> 
       </div> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <label for="status" class="col-md-2">Status : </label> 
       <div class="form-group col-md-4"> 

        @Html.DropDownList("status", (List<SelectListItem>)ViewBag.StatusList, new { @class = "form-control ComboM required", @ng_model = "hdr.status", @style = "width: 240px" }) 
        @Html.AntiForgeryToken() 
       </div> 
      </td> 
     </tr> 
    </table> 
</form> 

は、なぜこれが私のUIを更新するために失敗しています。

EDIT：以下も試しました。まだ運がない。

$scope.$watch("mySelectedItems[0]", function (newVal, oldVal) { 
     var val; 
     if (newVal != oldVal) { 
      if (newVal == undefined && oldVal) 
       $scope.hdr = oldVal; 
      else $scope.hdr = newVal; 
     } 
     // alert($scope.hdr.modulename); 
    }); 

EDIT 2：JS Fiddleではなく、私のプロジェクトで動作します。オリジナルをご覧くださいSO Question

Answer 1

$scope.hdrはオブジェクトのようです。オブジェクトは、JS内の参照によってバインドされます（配列と同様）。 $scope.hdr = yを設定し、この参照を破損させる原因となります。バインディングは結果として更新されません。あなたのオブジェクトの内容に応じて、angular.extendやangular.mergeを試みることがあります。

angular.extend($scope.hdr, y); 

ドキュメント：

https://docs.angularjs.org/api/ng/function/angular.extend