2016-04-11 12 views
0

をチェックし得ていないチェックボックスをangularjs:は、私は自分のアプリケーションで次のコードを持っている

 <input type="checkbox" ng-checked="vm.eduToEdit.test" /> 
     {{vm.eduToEdit.test}} 
     <input type="checkbox" ng-model="vm.eduToEdit.test"> 

vm.eduToEdit.testが真か偽diplayingませんが、関係なく、それは上記の入力のいずれかにcheckboesを返すものですされている値未検査。私は何が欠けているかわからない、私は、私はNGモデルを使用すべきではないと思ったので、私はNGチェックを試みたが、どちらもこれまで働いていない。 EDIT

: は、私は以下しようとしたが、同じ結果:

私のコントローラで
 <input type="checkbox" ng-checked="vm.eduToEdit.test" /> - 
     <input type="checkbox" ng-checked="checking" /> - 
     {{vm.eduToEdit.test}} 
     {{checking}} 

私が持っている:私は、ページを表示すると、真が書き出され

vm.eduToEdit.test = true; 
    $scope.checking = true; 

、しかし、私は決してチェックしてみてください。以下

は私のコントローラである。

(function() { 
'use strict'; 

myModule.controller('EducationController', ["$scope", "bootstrappedData", EducationController]); 

function EducationController($scope, bootstrappedData) { 
    var vm = this; 
    vm.shoppingCart = bootstrappedData.shoppingCart; 
    vm.eduToEdit = {}; 

    vm.EditEducation = function (applicantEducationId, educationTypeId) { 
     var owl = $(".owl-carousel"); 

     var eduFound = $.grep(this.shoppingCart, function (h) { 
      return h.ApplicantEducationId === applicantEducationId; 
     }); 
     vm.eduToEdit = eduFound[0]; 
     vm.eduToEdit.formattedAttendEnd = vm.ConvertToDate(vm.eduToEdit.AttendEnd); 
     vm.eduToEdit.formattedAttendStart = vm.ConvertToDate(vm.eduToEdit.AttendStart); 
     vm.eduToEdit.formattedGraduationDate = vm.ConvertToDate(vm.eduToEdit.GraduationDate); 

     vm.eduToEdit.test = true; 
     $scope.checking = true; 

     switch (educationTypeId) { 
      case 1: 
      case 2: 
      case 3: 
      case 4: 
       owl.trigger('to.owl.carousel', [1, 50]); 
       break; 
      case 5: 
       owl.trigger('to.owl.carousel', [3, 50]); 
       break; 
      case 6: 
       owl.trigger('to.owl.carousel', [2, 50]); 
       break; 
      case 7: 
       owl.trigger('to.owl.carousel', [4, 50]); 
       break; 
      case 9: 
       owl.trigger('to.owl.carousel', [5, 50]); 
       break; 
     } 
    }; 

    vm.ConvertToDate = function (jsonDateToConvert) { 
     if (jsonDateToConvert == null) 
      return ""; 
     var value = new Date 
     (
      parseInt(jsonDateToConvert.replace(/(^.*\()|([+-].*$)/g, '')) 
     ); 
     return value.getMonth() + 1 + "/" + value.getDate() + "/" + value.getFullYear(); 
    } 
} 

})();

+0

https://docs.angularjs.org/api/ng/directive/ngChecked )_この指示文は、予期しない動作につながる可能性があるため、ngModelと一緒に使用すべきではありません。@ –

+0

@AlonEitan第1の例はng-modelを使用しません。テストの価値は常に真実です、それはデータベースから来て、私は最初の1つがチェックされない理由を理解していません。 – Paritosh

+1

エラーが表示されますか?あなたのコントローラコードを共有できますか? –

答えて

0

最初に更新するには、ng-modelが2番目のチェックボックスとバインドされているので、最初のチェックボックスをクリックしてモデルの値を更新します。あなたがng-checkedを使用する場合は片道結合手段のみを表示のチェックや、このチェックボックスはオフが、コントローラ変数に変更されていないとして、それが動作します

<input type="checkbox" ng-checked="vm.test" /> 
    {{vm.test}} 
    <input type="checkbox" ng-model="vm.test" /> 

jsfiddle

1

domのコントローラ変数を変更する場合は、 の方がng-modelを使用してチェックするかチェックしない方が良いでしょう。次のように試すことができます:

controller as vmをdomで使用し、コントローラ内にthisを使用しました。 HTMLで

<body ng-controller="myCtrl as vm"> 
    <input type="checkbox" ng-model="vm.eduToEdit.test">{{vm.eduToEdit.test}} 
</body> 

コントローラ:ドキュメントを見てみましょう

angular.module('myApp',[]) 
.controller("myCtrl", function($scope) { 
    var vm = this; 
    vm.eduToEdit = {}; 
    vm.eduToEdit.test = true; 
}); 

DEMO LINK

+0

私のアップデートを参照してください、私はあなたが持っているものに似て何かが、私はデモで実行して参照してください、私は何が欠けているかわからない。 – Paritosh

+0

'ng-controller'要素でより多くのコントローラコードとhtmlを共有できますか? –

+0

は私の質問をコードで更新しました。 – Paritosh

関連する問題