양방향 바인딩이 각도 2로 작동하지 않습니다.

Question

내 프로젝트에서 jQuery 플러그인 (datepicker 및 iCheck)을 사용했으며 아마도 더 많은 플러그인을 사용하게 될 것입니다. 각도에서하지만 jQuery 플러그인 메서드를 호출 할 수 있지만 각도 2 방향 데이터 바인딩 jQuery 플러그인을 사용하는 요소에서 작동하지 않습니다.

예 : 내 구성 요소 타이프 스크립트 파일에 위의 체크 박스

<div class="checkbox icheck"> 
    <label > 
    <input type="checkbox" id="rememberMe" #rememberMe [(ngModel)]="rememberMeChecked"/> Remember Me 
    </label> 
</div> 

로 내 템플릿에 바인딩 적절한 데이터

import { Component, ViewChild, ElementRef, AfterViewInit, Input } from '@angular/core'; 

declare var jQuery: any; 

@Component({ 
selector: 'login', 
templateUrl: '/template/login.html' 
}) 

export class LoginComponent implements AfterViewInit { 
@Input() 
@ViewChild('rememberMe') input: ElementRef; 
rememberMeChecked: boolean; 
ngAfterViewInit() { 
    //Commenting iCheck method rusults in proper two-way data binding 
    jQuery(this.input.nativeElement).iCheck({ 
     checkboxClass: 'icheckbox_square-blue', 
     radioClass: 'iradio_square-blue', 
     increaseArea: '20%' // optional, 
    }); 
    // jQuery(this.input.nativeElement).on('ifChecked', function(){ 
    //  LoginComponent.rememberMeChecked = true; 
    // }) 
    // jQuery(this.input.nativeElement).on('ifUnchecked', function(){ 
    //  this.remember = false; 
    // }) 
    } 
} 

주석 iCheck 방법의 결과를 체크 박스를 가지고 있지만 인해 iCheck에 나는 상태를 확인 가져올 수 없습니다. 이것을 위해 무엇을해야만 하는가.

  체크 박스를 선택한 경우에도 rememberMeChecked 변수 값이 변경되지 않는 이유는 무엇입니까?

Answer 1

는 2 웨이 바인딩을 제거하고 시도 :

<input type="checkbox" id="rememberMe" #rememberMe 
     [checked]="rememberMeChecked" 
     (change)="rememberMeChecked = $event.target.checked"/>Remember Me</label>